What Is Shopify Liquid? Syntax, Use Cases & Limitations

What Is Shopify Liquid?

Liquid is Shopify's template language — a set of simple code instructions that tell Shopify how to display your store's data (products, prices, collections, customer info) inside HTML pages. When a customer visits your store, Shopify processes the Liquid code in your theme files, replaces it with real data, and sends the final HTML to the browser.

Developed by Shopify co-founder and CEO Tobias Lütke, Liquid was designed to be safe and easy to read, and it has been in production at Shopify since 2006. It's an open-source template language written in Ruby with over 11,850 stars on GitHub as of September 14, 2026.

Unlike general-purpose programming languages, Liquid runs in a sandbox — it can't access the server's file system, make network requests, or execute arbitrary code. This makes it safe for theme developers to write code that runs on Shopify's infrastructure.

Sources: Shopify/liquid on GitHub (star and contributor counts measured August 15, 2026) and the official Liquid project site

Here's the key distinction for business owners: Liquid is the code behind your theme, not something you interact with directly. When you use the theme editor to change colors or rearrange sections, you're adjusting settings that Liquid code reads and applies. Liquid is the engine; the theme editor is the steering wheel. How that engine plugs into modern section-based themes is covered in our Online Store 2.0 guide.

Quick Decision: Do You Need Liquid?

Before reading the technical sections below, determine whether Liquid is relevant to your situation. Most store owners never need it — and zooming out further, you don't need to know how to code at all to run a Shopify store; Liquid only enters the picture for the small slice of customizations the theme editor can't handle.

How Liquid Works: Objects, Tags & Filters

Most Liquid files in a Shopify theme are a mix of HTML and Liquid code. Shopify processes the Liquid parts on its servers, replaces them with real data, and sends pure HTML to the customer's browser. The customer never sees Liquid code — only the final rendered page.

Here's a practical example that ties all three together. This Liquid code displays a product's title and formatted price, but only if the product is available for purchase:

{% if product.available %}
  <h1>{{ product.title }}</h1>
  <p class="price">{{ product.price | money }}</p>
  <button>Add to Cart</button>
{% else %}
  <p>This product is currently sold out.</p>
{% endif %}

In this example: {{ product.title }} is an object that outputs the product name. {% if product.available %} is a tag that checks availability. | money is a filter that formats the raw price integer into a currency string like "$29.99". For the full list of available objects, tags, and filters, see the Liquid documentation.

Where Liquid Lives: Theme File Structure

Liquid code is organized into specific directories within a Shopify theme. Understanding this structure helps you know where to look (or where to tell a developer to look) when you need changes:

Source: Shopify Theme Architecture

Shopify Liquid Cheat Sheet

Keep this table open while you edit a theme or review a developer's changes: each row gives the name as Shopify's Liquid reference spells it, what it does, and one line of working syntax. Objects sit in double curly braces, tags in curly-percent braces, and filters follow a pipe — the same three building blocks described above.

Liquid vs No-Code: When You Need Each

Before hiring a developer or learning Liquid yourself, understand what the theme editor (no-code) can already do versus what requires Liquid:

What You Can Do with Liquid

Here are the most common real-world use cases where store owners need Liquid customizations — ordered by frequency:

Each of these use cases can be implemented by a developer in roughly 2–20 hours depending on complexity. For a cost breakdown by task type, see the Hiring a Liquid Developer section below.

Liquid also reaches past the storefront into the emails your store sends: notification templates are Liquid too, which is why editing one is a code job rather than a settings change — the gift card notifications are the clearest example of where that line falls.

Real Liquid Code Examples

You don't need to understand every line — the purpose of these examples is to show you what's possible and help you communicate requirements to a developer. All examples follow Shopify's theme development documentation.

1. Low Stock Badge

Shows a "Low Stock" badge when inventory drops below a threshold. Uses Liquid objects to access inventory data:

{% if product.selected_or_first_available_variant.inventory_quantity <= 5
    and product.selected_or_first_available_variant.inventory_quantity > 0 %}
  <span class="badge badge--low-stock">
    Only {{ product.selected_or_first_available_variant.inventory_quantity }} left
  </span>
{% endif %}

2. Metafield Content on Product Page

Pulls custom data (like care instructions) from a product metafield:

{% assign care = product.metafields.custom.care_instructions %}
{% if care != blank %}
  <div class="care-instructions">
    <h3>Care Instructions</h3>
    <p>{{ care.value }}</p>
  </div>
{% endif %}

3. Free Shipping Progress Bar

Displays a progress bar showing how much more the customer needs to spend for free shipping. Uses Liquid filters for math and currency formatting:

{% assign threshold = 7500 %}  {%- comment -%} $75.00 in cents {%- endcomment -%}
{% assign remaining = threshold | minus: cart.total_price %}

{% if remaining > 0 %}
  <p>Add {{ remaining | money }} more for free shipping!</p>
  {% assign progress = cart.total_price | times: 100 | divided_by: threshold %}
  <div class="progress-bar">
    <div class="progress-bar__fill" style="width: {{ progress }}%"></div>
  </div>
{% else %}
  <p>You qualify for free shipping!</p>
{% endif %}

4. Custom Section with Schema Settings

A reusable section where merchants configure content through the theme editor using schema settings:

<section class="announcement-bar" style="background: {{ section.settings.bg_color }}">
  <p>{{ section.settings.text }}</p>
</section>

{% schema %}
{
  "name": "Announcement Bar",
  "settings": [
    { "type": "text", "id": "text", "label": "Message", "default": "Free shipping on orders over $75" },
    { "type": "color", "id": "bg_color", "label": "Background Color", "default": "#000000" }
  ]
}
{% endschema %}

5. Collection-Based Product Tabs

Dynamically generates product tabs based on a collection handle using Liquid tags for looping:

{% for collection in section.settings.collections %}
  <div class="tab-content" data-tab="{{ collection.handle }}">
    {% for product in collection.products limit: 8 %}
      <a href="{{ product.url }}">
        <img src="{{ product.featured_image | image_url: width: 400 }}"
             alt="{{ product.title }}" loading="lazy" />
        <h4>{{ product.title }}</h4>
        <p>{{ product.price | money }}</p>
      </a>
    {% endfor %}
  </div>
{% endfor %}

Hiring a Liquid Developer: Costs & What to Expect

If you decide Liquid work is best left to a professional, here's what the market looks like as of September 2026 — freelance bands read from Upwork listings and the shopexperts.com pricing guide, agency rates from Clutch's Shopify directory, where advertised rates run $50–$199 an hour; the per-task ranges below are our editorial estimates:

Where to find Liquid developers: the Shopify Partner Directory lists Shopify Partner agencies and freelancers, tiered by experience and proven success on Shopify. For our recommended developers, see Ecom-Store.Pro. For a deeper breakdown of pricing, contracts, and red flags, read our guide to hiring a Shopify developer.

Common Liquid Mistakes to Avoid

Whether you're writing Liquid yourself or managing a developer, these are the five mistakes that cause the most damage — and they're all preventable:

Inherited a store where someone else already wrote the Liquid? Read what is there before you touch it: our store code audit guide covers how to separate working customizations from ghost code, and how to decide between fixing and rebuilding.

The Bottom Line

Liquid is the invisible engine behind every Shopify storefront. It's been in production since 2006, it's open-source, and it's still actively maintained (v5.13.0 shipped in June 2026). For business owners, the practical question isn't "should I learn Liquid?" — it's "do I need Liquid-level customizations, and if so, should I hire a developer or learn the basics myself?"

If you're still picking a starting theme, our guide to Shopify themes covers what's editable without code, and our custom design playbook walks through when Liquid work is genuinely needed.

Whether you're customizing the Horizon theme or building from scratch, Liquid gives Shopify the flexibility to match any brand's vision — without sacrificing the platform's security and reliability.

Frequently Asked Questions