← Back to guides
BeginnerLiquid · 2024-05-18

The Ultimate Shopify Liquid Beginner Guide

Everything you need to know to start coding Shopify themes from scratch. Learn about objects, tags, and filters in 5 minutes.

Welcome to Shopify Liquid

Liquid is an open-source template language created by Shopify. It is the backbone of all Shopify themes, used to load dynamic content into storefronts.

The Three Core Concepts

  • Objects: These output data. They are wrapped in double curly braces: {{ product.title }}.
  • Tags: These create logic and control flow. They are wrapped in curly braces and percent signs: {% if product.available %}.
  • Filters: These modify the output of objects. They are applied using a pipe character: {{ product.price | money }}.

Objects in Action

Objects represent variables. When Shopify renders a page, it replaces these objects with the specific data they represent.

<h1>{{ shop.name }}</h1>
<p>Welcome to {{ collection.title }}!</p>

Using Logic Tags

Tags don't produce visible text. Instead, they tell the template what to do. You can use them for conditional statements or loops.

{% if customer %}
  Hello, {{ customer.first_name }}!
{% else %}
  <a href="/account/login">Log in</a>
{% endif %}

Formatting with Filters

Filters change the output of a Liquid object. They are always separated by a pipe character |.

<!-- Converts a raw number into formatted currency -->
{{ 1999 | money }} <!-- Outputs: $19.99 -->

<!-- Makes text uppercase -->
{{ 'hello' | upcase }} <!-- Outputs: HELLO -->

Where Liquid Runs in a Theme

Liquid files live in your theme folder: sections/, snippets/, templates/, and layout/theme.liquid. Sections are what merchants add on the homepage; snippets are reusable partials you pull in with {% render %}.

Common Objects You Will Use Daily

  • product — on product pages and inside collection loops
  • collection — on collection templates
  • cart — in cart drawers and cart templates
  • section.settings — values merchants edit in the theme customizer

Next Steps

Once you understand objects, tags, and filters, explore the Liquid Cheat Sheet for copy-paste snippets. Then read Section Schema Explained to connect your HTML to the theme editor.

Build faster with HTMLToLiquid Converter

Convert static HTML into dynamic Shopify sections.

Open converter