.dev
Partner Dashboard

Liquid ​

Last updated View as Markdown

Liquid is the templating language YouCan themes are built with. It lets you mix static HTML with logic and store data, so a theme can render a different page for every product, collection, or cart without writing a line of application code.

liquid
<h1>{{ product.name }}</h1>

{% if product.available %}
  <span>{{ product.price | money }}</span>
{% else %}
  <span>{{ 'product.sold_out' | t }}</span>
{% endif %}

Building blocks ​

ObjectsStore data you can output or loop over, like product or cart.
TagsLogic that controls a template: conditionals (if, unless, case), loops (for), and helpers (form, paginate, render). Browse the full list under Developer Tools ▸ Liquid ▸ Tags in the sidebar.
FiltersFunctions applied to a value with the pipe (|) character, for formatting and transforming output, for example {{ product.price | money }}. Browse the full list under Developer Tools ▸ Liquid ▸ Filters in the sidebar.
BasicsThe primitive types and operators Liquid expressions are built from.

Where Liquid runs ​

Liquid renders layouts, templates, sections, and snippets. Which objects are available depends on where you are: some, like cart and settings, are global; others, like product, only exist on the template they belong to. Each template type page documents the objects it receives.

Errors ​

When a Liquid error occurs, YouCan replaces only the failed part of the page with an error message. The rest of the page is rendered.

  • If a tag or an output fails at render time, the error message is shown in its place.
  • If a section, snippet or app block cannot be parsed, the error message is shown instead of it. A section keeps its wrapper element, so you can still select it in the theme editor.
  • If a layout or a JSON template has an error, the error message is shown instead of the page.

The message contains the file and the line number:

Liquid error (sections/featured-products.liquid line 12): at_least filter input should be a number

If a filter or a tag fails for a reason that is not in the theme, the message is internal error. App embeds are rendered in <head> and at the end of <body>, so a failed tag in an embed is not shown.

In the code editor, Liquid syntax errors are marked on their line while you type. You cannot save a section that has a syntax error.