Shopify Liquid cheatsheet for theme developers

What this cheatsheet covers

Shopify Liquid is the templating language behind every Online Store 2.0 theme. This cheatsheet collects the tags, filters, and objects you use daily when building sections, snippets, and JSON templates. Bookmark it alongside the interactive reference at /shopify-cheat-sheet and use the HTML to Liquid converter at /converter when you need to turn static markup into editable sections.

Output tags and variables

Liquid output uses double curly braces. Objects expose store data; section.settings expose merchant-configured values from schema.

{{ product.title }}
{{ section.settings.heading }}
{{ block.settings.question }}

Liquid tags you use constantly

Conditional logic

{% if product.available %}
  <span>In stock</span>
{% elsif product.tags contains 'preorder' %}
  <span>Preorder</span>
{% else %}
  <span>Sold out</span>
{% endif %}

Loops

for loops iterate collections, products, cart items, and section.blocks. Use limit and offset to control output size.

{% for product in collection.products limit: 4 %}
  <h3>{{ product.title }}</h3>
{% endfor %}

{% for block in section.blocks %}
  <div {{ block.shopify_attributes }}>
    {{ block.settings.title }}
  </div>
{% endfor %}

assign and capture

assign stores a value in a variable for reuse. capture stores rendered markup into a string—useful for building class lists or deferring output.

{% assign featured = collections['frontpage'] %}

{% capture card_classes %}
  product-card product-card--{{ section.settings.style }}
{% endcapture %}

render and include

render loads a snippet with an isolated scope—preferred over legacy include. Pass variables explicitly as parameters.

{% render 'product-card',
  product: product,
  show_vendor: section.settings.show_vendor %}

Essential Liquid filters

• money — format prices: {{ product.price | money }}
• image_url / image_tag — responsive images from image_picker settings
• escape / strip_html — sanitize user-facing strings
• default — fallback values: {{ product.metafields.custom.badge | default: 'New' }}
• split / join / replace — string manipulation for class names and URLs
• where — filter arrays: {{ collection.products | where: 'available' }}

{{ section.settings.image
  | image_url: width: 1200
  | image_tag: loading: 'lazy', alt: section.settings.alt }}

Section schema quick reference

Every Online Store 2.0 section ends with a schema block defining settings, blocks, and presets. Common setting types: text, richtext, image_picker, url, collection, product, range, checkbox, select, color.

{% schema %}
{
  "name": "Custom banner",
  "settings": [
    { "type": "text", "id": "heading", "label": "Heading" }
  ],
  "blocks": [],
  "presets": [{ "name": "Custom banner" }]
}
{% endschema %}

Practical workflow for theme developers

• Prototype layout in HTML, then convert with /converter or the /shopify-section-generator.
• Validate schema with the /liquid-schema-generator before merging into your theme repo.
• Scope CSS with #shopify-section-{{ section.id }} to avoid global style leaks.
• Use block.shopify_attributes on every block wrapper for theme editor highlighting.
• Ship presets so merchants can insert sections from the Add section panel immediately.

When to reach for blocks vs settings

Flat settings suit fixed heroes and single-instance banners. Blocks suit FAQs, sliders, feature rows, and any content merchants add or reorder. The /dynamic-shopify-blocks-guide covers block architecture in depth; /shopify-schema-guide explains setting types and validation rules.

Shopify objects cheat sheet

Objects expose store data to Liquid. Availability depends on the template type—product objects exist on product.json, collection objects on collection templates, and cart is global.

• product.title, product.price, product.featured_image, product.url, product.variants
• collection.products, collection.title, collection.handle, collection.image
• cart.item_count, cart.total_price, cart.items — line_item inside cart loops
• shop.name, shop.url, shop.currency — store-level metadata
• request.page_type, template.name — conditional layout branching

case and unless patterns

{% case block.type %}
  {% when 'slide' %}
    {% render 'slide', block: block %}
  {% when 'quote' %}
    {% render 'quote', block: block %}
{% endcase %}

Performance-conscious Liquid

• Use limit on product loops to cap rendered cards.
• Avoid nested collection lookups inside tight loops.
• Lazy-load images with image_tag loading parameter.
• Prefer render over nested includes to isolate scope.
• Keep block counts reasonable—max_blocks in schema helps.

Connecting cheatsheet to your workflow

New developers should read /shopify-liquid-for-beginners first, then keep this cheatsheet open while building. When you receive HTML from design, skip manual mapping—paste into /shopify-liquid-converter or /converter and compare output against patterns in /shopify-liquid-examples. Theme-specific deployment notes live under /html-to-dawn-theme and related guides.