What are the HTML/Liquid elements I need to know?

Individual Collection (The database id of the collection - e.g. 392893) (The name of the collection - e.g. Awesome T-shirts)
collection.permalink (The url-friendly name of the collection - e.g. awesome-t-shirts)
collection.full_url (The url of the collection - e.g.")
collection.url (Does not include store url e.g /collections/1111-awesome-t-shirts")
collection.products (All the Products in the Collection)
collection.product_count (The total number of active Products in the Collection)
collection.description (The descriptive text for the Collection)
collection.image or (The cover image for the Collection)
collection.medium_image (315 x 210 px Collection Image)
collection.has_image? (returns true or false)

Featured Collection

Certain themes take advantage of featured Collections, here is how you reference it.



collections.all (All of your store's collections including the hidden collections)
collections.nav (Your store's active collections that are not hidden used for navigation) 
collections.all.size (The total number of collections including hidden)
collections.nav.size (The total number of active collections that are not hidden) (Only your store's Collections which contain active products)
collections.first (The first Collection in your store, as you've ordered them in your admin panel)
Use collections.{collection permalink} to reference a specific Collection (e.g. collections.1111-awesome-t-shirts)

Contact Form (The user's email) (The user's name)
contact.subject (The subject line of the Contact form)
contact.message (The message body of the Contact form (Also called :description)) (The user's phone number)
contact.order_number (The user's submitted order number)
contact.sent (Returns true if a support message was sent successfully)
contact.captcha (Spam protection question)
contact.captcha_id (Spam protection question ID)


faq.question (The FAQ question)
faq.answer (The FAQ answer)


faqs.all (All of your store's FAQs)

Page (A specific page object) (The page ID) (The page's name. Usually the current collection or product's name - e.g. Awesome Shirt)
page.type (The type of page)
page.permalink (The page's url-friendly name e.g. "contact" or "faq")
page.url (The page's url - e.g. "/contact")
page.full_url (The page's url including your store's address - e.g. "")
page.description (An html-safe description of the page intended for use in a meta tag to improve SEO ranking. e.g. <meta name="description" content="{{page.description}} - Online Store Powered by Storenvy"/>   )
page.keywords (An html-safe list of keywords based on either the current product's tags or the store's collection names intended for use in a meta tag to improve SEO ranking. e.g.. - <meta name="keywords" content="{{page.keywords}}" />  )
page.custom? (Returns true if the page is a custom page, false if it isn't)

Pages (The master Page class)

pages.all (Returns Page objects for all of the "special" pages for your store - e.g. Contact, FAQ, and any custom pages)
pages.pagename (Returns a Page object by referencing the page's permalink e.g. {{ }} or {{ pages.faq }}   )
pages.custom (Returns Page objects for all of the custom pages for your store)

Pagination - (Returns true if a collection is paginated)
pagination.has_prev - (Returns true if there is a previous page)
pagination.prev_url - (The URL of the previous page)
pagination.has_next - (Returns true if there is a next page)
pagination.next_url - (The URL of the next page)
pagination.page_numbers - (The number of pages in the pagination set)
pagination.default_links - (Standard pagination breadcrumb links)

Product (The product's id) (The product's name)
product.description (The product's description)
product.price (The product's price - e.g. "8.99")
product.url (The product's url - e.g. /products/t-shirt-39")
product.full_url (The product's url including store url e.g. "")
product.css_class (e.g. "product label coming soon, pre-order, sale")
product.status (e.g. "active, sold out, coming soon")

product.variants (Returns all of the Product's Variants - also called :options)
product.variant (Returns the default Variant for the Product if the Product has a default Variant - also called :option)
product.variants_in_stock (Returns all of the Variants that currently have a quantity in stock above 0 - also called :options_in_stock)
product.has_default_variant (Returns true or phase if the Product has a Variant called "DEFAULT" - also called :has_default_option)
product.collections (Returns all the Collections that the Product is in - also called :categories)
product.images (Returns all of the Product's Photos - also called :photos)
product.image (Returns the first Photo of a Product - also called :photo)
product.image_count (The number of Photos uploaded for a Product)
product.edit_url (Returns the url to the admin panel "")
product.related_products (Simple way to grab five products that share tags)
product.tags (Returns a Collection of tag drops) (The tax total of an item e.g.1.25 Note: Tax is only charged to customers in your same region/location)
product.prev - (Returns previous product in your store or collection) - (Returns next product in your store or collection)


photo.url (The url of the Photo)
photo.width (The width of the original Photo)
photo.height (The heigh of the original Photo)
photo.alt  (The alternate text for the photo)
photo.url_64 (The URL of the photo resized to 64px wide)
photo.url_64sq (The URL of the photo resized to 64px wide cropped square)
photo.width_64 (The width of the photo resized to 64px wide)
photo.height_64 (The height of the photo resized to 64px wide)
photo.url_200 (The URL of the photo resized to 200px wide)
photo.url_200sq (The URL of the photo resized to 200px wide cropped square)
photo.width_200 (The width of the photo resized to 200px wide)
photo.height_200 (The height of the photo resized to 200px wide)
photo.url_400 (The URL of the photo resized to 400px wide)
photo.url_400sq (The URL of the photo resized to 400px wide cropped square)
photo.width_400 (The width of the photo resized to 400px wide)
photo.height_400 (The height of the photo resized to 400px wide)
photo.url_600 (The URL of the photo resized to 600px wide)
photo.url_600sq (The URL of the photo resized to 600px wide cropped square)
photo.width_600 (The width of the photo resized to 600px wide)
photo.height_600 (The height of the photo resized to 600px wide)
photo.url_1000 (The URL of the photo resized to 1000px wide)
photo.url_1000sq (The URL of the photo resized to 1000px wide cropped square)
photo.width_1000 (The width of the photo resized to 1000px wide)
photo.height_1000 (The height of the photo resized to 1000px wide)
photo.url_max (The URL of the photo at the maximum size)
photo.width_max (The width of the photo at the maximum size)
photo.height_max (The height of the photo at the maximum size)


products.all (Returns all of the Store's Products)
products.current (Returns the Products for the current page)
products.top_selling (Returns the 5 best-selling Products for your store)
products.count (Returns the number of active products in your Store)
products.newest (Returns the 5 newest products in your Store)
products.url (The url for your Store's Product page. e.g. "" - "{{ products.32-awesome-t-shirt }}" - (returns a Product object by referencing the Product's permalink))


search.term (The term used for the search)
search_results_count (The number of search results found)
search.performed (Returns true if a search was performed)

Store (Your store's name)
store.url (Your store's url) (Your store's support email)
store.description (Your store's description)
store.location (Your store's location - e.g. "Santa Monica, CA") (Your store's first Place - Also called :website)
store.places (Returns all of your store's Places - Also called :websites)
store.logo_url (The url of your Store's profile pic)
store.has_logo? (Returns true if store has logo) (Returns true if the store is currently Active)
store.show_in_marketplace (Returns true if the store is listed in the Storenvy Marketplace) 
store.banner_image (Returns a Photo object for the Store's banner image)
store.background_image (Store's background image)

store.featured_promotion_text (Description of current featured promotion)
store.use_theme_background (True or False for displaying the uploaded background image)
store.show_store_name (True or False for displaying the store name as inputted in the "Settings" tab)
store.show_logo (True or False for displaying the store logo/avatar)

Place (Links) (e.g. "My Website")
place.url (ex. "")

Tag (Text of the tag)
tag.marketplace_search_url (URL for browsing that tag in the Marketplace)


theme.banner (Returns your Store's Banner Image Photo object - also called :image)
theme.background (Returns your Store's Background Image Photo object)
theme.css (Returns your store's CSS - also called :styles)
theme.show_inventory_bars (Always true for displaying inventory bars)
theme.updated_at (The timestamp of the last update to your Theme)

Other theme attributes may be available, if your theme supports them such as {{ theme.featured_collection }}.

Variant (The database id for the Variant. Needed when adding items to the user's Cart) (The Variant's name. ex. "Medium")
variant.quantity (The quantity in-stock for the Variant)
variant.full_quantity (The amount you have indicated that should reflect a "full" stock bar)
variant.percent_available (The percent of your inventory left in stock. quantity ÷ full_quantity (Max. 100))
variant.position (The position of the Variant according to the order you sorted them, e.g. 3)
variant.sold (The number of items that have been sold of this Variant)
variant.sold_out (Returns true if the Variant's quantity is 0)
variant.status (Can be sold out or active)
variant.default (Returns true if the Variant is named "DEFAULT")
variant.is_default_variant? (Tells whether or not it shows default as name)

Did you find this article helpful?