StokzoneDevelopers

Zone tags

Tags build a template's logic: conditions, loops, variables, snippet calls and theme tags.

This page is not hand-written: it is generated from the Zone engine's registry. Every name listed here actually works in the engine.

Summaries come straight from the source specification. Some summaries, syntax and examples are generated from MIT-licensed open specification data. Third-party licence notice

assign

Creates a new variable.

Syntax
{% assign variable_name = value %}
Example
{%- assign product_title = product.title | upcase -%}

{{ product_title }}

break

Stops a `for` loop from iterating.

Syntax
{% break %}
Example
{% for i in (1..5) -%}
  {%- if i == 4 -%}
    {% break %}
  {%- else -%}
    {{ i }}
  {%- endif -%}
{%- endfor %}

capture

Creates a new variable with a string value.

Syntax
{% capture variable %}
  value
{% endcapture %}
Example
{%- assign up_title = product.title | upcase -%}
{%- assign down_title = product.title | downcase -%}
{%- assign show_up_title = true -%}

{%- capture title -%}
  {% if show_up_title -%}
    Upcase title: {{ up_title }}
  {%- else -%}
    Downcase title: {{ down_title }}
  {%- endif %}
{%- endcapture %}

{{ title }}

case

Renders a specific expression depending on the value of a specific variable.

Syntax
{% case variable %}
  {% when first_value %}
    first_expression
  {% when second_value %}
    second_expression
  {% else %}
    third_expression
{% endcase %}
Example
{% case product.type %}
  {% when 'Health' %}
    This is a health potion.
  {% when 'Love' %}
    This is a love potion.
  {% else %}
    This is a potion.
{% endcase %}
Example — Multiple values
{% case product.type %}
  {% when 'Love' or 'Luck' %}
    This is a love or luck potion.
  {% when 'Strength','Health' %}
    This is a strength or health potion.
  {% else %}
    This is a potion.
{% endcase %}

comment

Prevents an expression from being rendered or output.

Syntax
{% comment %}
  content
{% endcomment %}
Example — Inline comments
{% # this is a comment %}

{% # for i in (1..3) -%}
  {{ i }}
{% # endfor %}

{%
  ###############################
  # This is a comment
  # across multiple lines
  ###############################
%}
Example — Inline comments inside `liquid` tags
{% liquid
  # this is a comment
  assign topic = 'Learning about comments!'
  echo topic
%}

content_for

Creates a designated area in your theme where blocks can be rendered.

Syntax
{% content_for 'blocks' %}
{% content_for 'block', type: "slide", id: "slide-1" %}
Example — blocks
{% content_for "blocks" %}
Example — block
{% content_for "block", type: "button", id: "static-block-1", color: "red" %}

continue

Causes a `for` loop to skip to the next iteration.

Syntax
{% continue %}
Example
{% for i in (1..5) -%}
  {%- if i == 4 -%}
    {% continue %}
  {%- else -%}
    {{ i }}
  {%- endif -%}
{%- endfor %}

cycle

Loops through a group of strings and outputs them one at a time for each iteration of a `for` loop.

Syntax
{% cycle string, string, ... %}
Example
{% for i in (1..4) -%}
  {% cycle 'one', 'two', 'three' %}
{%- endfor %}
Example — Create unique cycle groups
<!-- Iteration 1 -->
{% for i in (1..4) -%}
  {% cycle 'one', 'two', 'three' %}
{%- endfor %}

<!-- Iteration 2 -->
{% for i in (1..4) -%}
  {% cycle 'one', 'two', 'three' %}
{%- endfor %}

<!-- Iteration 3 -->
{% for i in (1..4) -%}
  {% cycle 'group_1': 'one', 'two', 'three' %}
{%- endfor %}

<!-- Iteration 4 -->
{% for i in (1..4) -%}
  {% cycle 'group_2': 'one', 'two', 'three' %}
{%- endfor %}

decrement

Creates a new variable, with a default value of -1, that's decreased by 1 with each subsequent call. > Caution: > Predefined Liquid objects can be overridden by variables with the same name. > To make sure that you can access all Liquid objects, make sure that your variable name doesn't match a predefined object's name.

Syntax
{% decrement variable_name %}
Example
{% decrement variable %}
{% decrement variable %}
{% decrement variable %}

doc

Documents template elements with annotations.

Syntax
{% doc %}
  Renders a message.

  @param {string} foo - A string value.
  @param {string} [bar] - An optional string value.

  @example
  {% render 'message', foo: 'Hello', bar: 'World' %}
{% enddoc %}

echo

Outputs an expression.

Syntax
{% liquid
  echo expression
%}
Example
{% echo product.title %}

{% liquid
  echo product.price | money
%}

else

Allows you to specify a default expression to execute when no other condition is met.

Syntax
{% else %}
  expression
Example
{% if product.available %}
  This product is available!
{% else %}
  This product is sold out!
{% endif %}

else

Allows you to specify a default expression to execute when a `for` loop has zero length.

Syntax
{% for variable in array %}
  first_expression
{% else %}
  second_expression
{% endfor %}
Example
{% for product in collection.products %}
  {{ product.title }}<br>
{% else %}
  There are no products in this collection.
{% endfor %}

for

Renders an expression for every item in an array.

Syntax
{% for variable in array %}
  expression
{% endfor %}
ParametersTypeRequiredDescription
limitnumberNoThe number of iterations to perform.
offsetnumberNoThe 1-based index to start iterating at.
rangeuntypedNoA custom numeric range to iterate over.
reverseduntypedNoIterate in reverse order.
Example
{% for product in collection.products -%}
  {{ product.title }}
{%- endfor %}
Example — limit
{% for product in collection.products limit: 2 -%}
  {{ product.title }}
{%- endfor %}

form

Generates an HTML `<form>` tag, including any required `<input>` tags to submit the form to a specific endpoint.

Syntax
{% form 'form_type' %}
  content
{% endform %}
ParametersTypeRequiredDescription
return_tostringNoThe desired URL to redirect to when the form submits.
Example — activate_customer_password
{% form 'activate_customer_password' %}
  &lt;!-- form content --&gt;
{% endform %}
Example — cart
{% form 'cart', cart %}
  &lt;!-- form content --&gt;
{% endform %}

if

Renders an expression if a specific condition is `true`.

Syntax
{% if condition %}
  expression
{% endif %}
Example
{% if product.compare_at_price &gt; product.price %}
  This product is on sale!
{% endif %}
Example — elsif
{% if product.type == 'Love' %}
  This is a love potion!
{% elsif product.type == 'Health' %}
  This is a health potion!
{% endif %}

includeDeprecated

Renders a snippet.

Syntax
{% include 'filename' %}

increment

Creates a new variable, with a default value of 0, that's increased by 1 with each subsequent call. > Caution: > Predefined Liquid objects can be overridden by variables with the same name. > To make sure that you can access all Liquid objects, make sure that your variable name doesn't match a predefined object's name.

Syntax
{% increment variable_name %}
Example
{% increment variable %}
{% increment variable %}
{% increment variable %}

javascript

JavaScript code included in section, block and snippet files.

Syntax
{% javascript %}
  javascript_code
{% endjavascript %}

layout

Specify which layout to use.

Syntax
{% layout name %}

liquid

Allows you to have a block of Liquid without delimeters on each tag.

Syntax
{% liquid
  expression
%}
Example
{% liquid
  # Show a message that's customized to the product type

  assign product_type = product.type | downcase
  assign message = ''

  case product_type
    when 'health'
      assign message = 'This is a health potion!'
    when 'love'
      assign message = 'This is a love potion!'
    else
      assign message = 'This is a potion!'
  endcase

  echo message
%}

paginate

Splits an array's items across multiple pages.

Syntax
{% paginate array by page_size %}
  {% for item in array %}
    forloop_content
  {% endfor %}
{% endpaginate %}
ParametersTypeRequiredDescription
window_sizestringNoThe number of pages to display in the pagination.
Example
{% paginate collection.products by 5 %}
  {% for product in collection.products -%}
    {{ product.title }}
  {%- endfor %}

  {{- paginate | default_pagination }}
{% endpaginate %}
Example — Limit data fetching
{% paginate collection.products by 4 %}
  {% for product in collection.products limit: 4 -%}
    {{ product.title }}
  {%- endfor %}
{% endpaginate -%}

&lt;!-- Less performant method --&gt;
{% for product in collection.products limit: 4 -%}
  {{ product.title }}
{%- endfor -%}

raw

Outputs any Liquid code as text instead of rendering it.

Syntax
{% raw %}
  expression
{% endraw %}
Example
{% raw %}
{{ 2 | plus: 2 }} equals 4.
{% endraw %}

render

Renders a snippet or app block.

Syntax
{% render 'filename' %}
Example — for
{% render 'filename' for array as item %}
Example — Passing variables to a snippet
{% render 'filename', variable: value %}

section

Renders a section.

Syntax
{% section 'name' %}
Example
{% section 'header' %}

sections

Renders a section group.

Syntax
{% sections 'name' %}

style

Syntax
{% style %}
  CSS_rules
{% endstyle %}
Example
{% style %}
  .h1 {
    color: {{ settings.colors_accent_1 }};
  }
{% endstyle %}

stylesheet

CSS styles included in section, block, and snippet files.

Syntax
{% stylesheet %}
  css_styles
{% endstylesheet %}

tablerow

Generates HTML table rows for every item in an array.

Syntax
{% tablerow variable in array %}
  expression
{% endtablerow %}
ParametersTypeRequiredDescription
colsnumberNoThe number of columns that the table should have.
limitnumberNoThe number of iterations to perform.
offsetnumberNoThe 1-based index to start iterating at.
rangeuntypedNoA custom numeric range to iterate over.
Example
&lt;table&gt;
  {% tablerow product in collection.products %}
    {{ product.title }}
  {% endtablerow %}
&lt;/table&gt;
Example — cols
&lt;table&gt;
  {% tablerow product in collection.products cols: 2 %}
    {{ product.title }}
  {% endtablerow %}
&lt;/table&gt;

unless

Renders an expression unless a specific condition is `true`.

Syntax
{% unless condition %}
  expression
{% endunless %}
Example
{% unless product.has_only_default_variant %}
  // Variant selection functionality
{% endunless %}