Liquid is the templating language Shopify themes use to display dynamic store content. It lets a theme show products, collections, cart data, customer information, metafields, menus, and theme settings without writing backend code.
What Is Liquid?
Liquid is a safe, readable template language created by Shopify. It mixes HTML with dynamic values and simple control flow.
The Three Building Blocks of Liquid
Objects
Objects output data with double curly braces.
{{ product.title }}
{{ shop.name }}
{{ collection.title }}Tags
Tags control logic with curly braces and percent signs.
{% if product.available %}
<p>In stock</p>
{% else %}
<p>Sold out</p>
{% endif %}Filters
Filters transform output.
{{ product.title | upcase }}
{{ product.price | money }}Liquid Objects You’ll Use Often
Start with product, collection, cart, customer, shop, and section. These objects cover most beginner theme work.
Control Flow
Use if, elsif, else, unless, and case to render different markup based on store data.
{% if product.compare_at_price > product.price %}
<span class="badge">Sale</span>
{% endif %}Loops
Loops render lists of products, menu links, blocks, cart items, and images.
{% for product in collection.products %}
<article>
<h2>{{ product.title }}</h2>
<p>{{ product.price | money }}</p>
</article>
{% endfor %}Useful Filters
Common filters include money, escape, strip, truncate, default, date, image_url, and asset_url.
{{ product.featured_image | image_url: width: 800 | image_tag: alt: product.title }}Snippets and render
Use snippets to reuse theme code. In modern themes, prefer render.
{% render 'product-card', product: product %}Common Mistakes
- Using a template-specific object where it is not available.
- Adding too much business logic inside Liquid.
- Forgetting to escape merchant-entered content where needed.
- Confusing snippets with sections.
- Not testing code inside the theme editor.
Summary
Liquid is simple, but it becomes powerful when combined with sections, blocks, JSON templates, and metafields. Learn objects, tags, filters, loops, and snippets first, then build real sections to practice.
Learn Liquid in context by building real Shopify themes in the codewith Mehedi course.
