Glossary

What is Liquid Shopify? Definition

June 4, 2026

Shopify Liquid is the template language used by Shopify to load store data into web pages visible to customers. It allows you to automatically display a product title, price, stock, images, collections, or conditional blocks in a theme. Liquid bridges the gap between the Shopify back-office and the final HTML sent to the browser. As a merchant, it is not always necessary to master it, but understanding it helps to communicate better with an agency or a developer.

Summary

Definition of Shopify Liquid

Why Liquid is essential in a Shopify store

Theme structure and the role of Liquid

Edit Liquid on Shopify without weakening the theme

Points of attention when working with Liquid

In summary

Related terms, FAQ, and useful resources

Definition of Shopify Liquid

Liquid mixes static HTML and dynamic tags that inject values from Shopify (product price, collection title, canonical URL).

Three basic syntaxes:

In practice, this mainly covers Output: {{ product.title }} displays the product title; Logic tags: {% if product.available %}In stock{% endif %}; and Filters: {{ product.price | money }} formats the price in local currency.

Common Liquid objects in e-commerce:

In practice, this mainly covers product: title, price, variants, images, description; collection: products in a category (Shopify collection); cart: cart lines, total; shop: store name, domain, currency; customer: logged-in customer (account); and request: current page, locale.

Useful Liquid tags:

In practice, this mainly covers {% for %}: loop over products, variants, menu links; {% assign %}: temporary variable; {% render %}: include a reusable snippet; and {% section %}: OS 2.0 section (legacy).

Useful distinctions:

In practice, this mainly covers Liquid vs JavaScript: Liquid = Shopify server; JS = client browser; Liquid vs HTML: Liquid generates the final HTML; Liquid vs PHP (WooCommerce): other CMS use other template languages; Theme Liquid vs Shopify API: Liquid accesses objects on the current page; REST/GraphQL API for apps and external integrations; and Storefront Liquid vs Notification Liquid: order emails also use Liquid (order variables, line_items).

Liquid is therefore not just a simple technical detail: it is the layer that allows a Shopify theme to remain dynamic. The same structure can display different information depending on the product, the collection, availability, or the browsing context.

Why Liquid is essential in a Shopify store

Every Shopify Online Store is based on Liquid: even without coding, the Theme Editor modifies sections written in Liquid under the hood.

In practice, this mainly covers Real-time catalog data: prices, stock, promos displayed without a static base; Theme customization: product layout, badges, conditional blocks; Technical SEO: {{ canonical_url }} , dynamic titles ( canonical link , meta tags ); Internationalization: translation filters, Markets, currencies; Transactional emails: personalized Liquid order confirmation; Schema.org: JSON-LD product injected via Liquid snippets ( structured data ); and Apps and theme: apps sometimes expose Liquid objects or blocks in sections.

The merchant can sell without mastering Liquid (Theme Editor is enough). Liquid becomes essential for tailor-made developments with an agency or a theme developer.

In an e-commerce glossary logic, the key is therefore to understand the concept, but also its concrete effects on conversion, internal organization, margin, or the quality of the customer experience.

Theme structure and the role of Liquid

Typical Shopify 2.0 theme structure:

In practice, this mainly covers layout/theme.liquid: global HTML skeleton (head, body, scripts); templates/*.json: section composition by page type (product, collection, index); sections/*.liquid: modular blocks (hero, featured collection); snippets/*.liquid: reusable components (cart icon, price); assets/: CSS, JS, static images; and config/settings_schema.json: Theme Editor settings.

Example of a product price snippet:

{% if product.compare_at_price > product.price %}
  <span class="price-sale">{{ product.price | money }}</span>
  <span class="price-compare">{{ product.compare_at_price | money }}</span>
{% else %}
  <span class="price">{{ product.price | money }}</span>
{

Use case: A DTC brand wants to display "Free shipping from €60" only if cart > €60. The developer adds a condition {% if cart.total_price > 6000 %} (price in cents) to snippets/free-shipping-bar.liquid. Snippet included via {% render 'free-shipping-bar' %} in theme.liquid. Theme Editor allows the merchant to enable/disable the section without touching the code. Duplicate theme previewed before publishing live.

This type of case shows that a technical or marketing concept only has value if it is linked to a specific use: a better user journey, a more reliable decision, better-controlled costs, or a clearer experience for the buyer.

Edit Liquid on Shopify without weakening the theme

Two levels of Liquid access (Shopify Help Center):

In practice, this mainly covers Theme Editor (no-code): reorganizing sections, texts, images; underlying Liquid not visible; and Edit code: Online Store > Themes > Actions > Edit code; access to .liquid files.

Useful workflow tips:

First, duplicate the live theme before making any Liquid modifications. Next, work on a preview theme, test product/collection/cart. Then, use {% render %} for snippets instead of copy-pasting. After that, document custom changes (parent theme updates can overwrite). Finally, publish after mobile and SEO validation (View Source).

Official resources:

In practice, this mainly covers Shopify.dev Liquid reference: objects, tags, filters; Theme Check: Liquid linter (useful tips, errors); and GitHub theme Dawn: open-source OS 2.0 reference theme.

Liquid limitations: no arbitrary database access, no external HTTP calls from storefront Liquid (security). Complex logic or external data must go through JavaScript + Ajax API or apps.

On Shopify, the best practice is generally to start with native features, then supplement with a theme, an app, or an integration only when the business need justifies it.

Points of attention when working with Liquid

In practice, this mainly covers reusable Snippets: price, badges, cart icon in a single file; Clear conditions: if product.available before buy button; money / image_url filters: native formatting rather than hardcoding €; Escaping user content: escape filter if risky HTML injection; Performance: avoid huge for loops on all_products; Metafields: product.metafields.custom.xxx for custom data; and Liquid Comments: {% comment %} ... {% endcomment %} for maintainability.

Key areas of vigilance:

In practice, this mainly covers Editing theme.liquid live without backup (storefront crash); Confusing Liquid and JavaScript ({{ }} syntax in .js file); Forgetting that Liquid prices are in cents (6000 = €60.00); Hardcoding texts instead of Theme Editor settings (difficult i18n); Duplicating 500 lines instead of a render snippet; Updating parent Dawn theme without merging custom Liquid; and Heavy business logic in Liquid: prefer app or Functions.

The right approach is to document rules, test changes on a limited scope, and verify their actual impact before rolling them out to the entire store.

In summary

In practice, this mainly covers Liquid = Shopify template language (output, tags, filters); Objects: product, collection, cart, shop, customer; Files: layout, JSON templates, sections, snippets; Distinct from JavaScript (client), HTML (output), API (apps); and Theme Editor for merchants; Edit code for devs; duplicate theme before modifying.

The essential part is to link this concept to a concrete use case: sell better, measure better, organize the store better, or reduce friction in the customer journey.

Related terms, FAQ, and useful resources

Associated Terms

FAQ

Do you need to learn Liquid to sell on Shopify?

No for daily operations: the Theme Editor is sufficient for most stores. Liquid becomes useful for theme customizations, fixing a display issue, or working with a developer.

Liquid and JavaScript: which one to modify for the AJAX cart?

The initial HTML of the cart comes from Liquid. The behavior without reloading (Ajax Cart) is managed in JavaScript, which calls /cart/add.js. Both work together.

Where do you edit Liquid on Shopify?

Go to Online Store > Themes > Actions > Edit code. Modify sections, snippets, or the layout. Always duplicate the live theme before making changes.

Is Liquid exclusive to Shopify?

Created by Shopify, Liquid is open source and used elsewhere (Jekyll, certain CMS). In e-commerce, it is mainly associated with Shopify themes and Shopify email notifications.

Going Further

Sources: Shopify.dev (Liquid reference), Shopify Help Center (Edit code).

What is gross profit? E-commerce definition

Enzo

13 May 2026

Convert over 2,000 customers on average per month with Qstomy.

The world’s 1st Shopify AI dedicated to customer conversion

Empowering 200+ e-commerce merchants

Subscribe to the newsletter and get a personalized e-book!

No-code solution, no technical knowledge required. AI trained on your e-shop and non-intrusive.

Sign up for the waitlist

*Unsubscribe at any time. We do not send spam.