Shopify Liquid Common Tags

Shopify Liquid has lots of tags for various operation, among those some of them are used commonly. In this section, you are going to learn those tags.


Shopify Liquid comment tag

Prevents an expression from being rendered or output. Any text inside comment tags won’t be output, and any Liquid code will be parsed, but not executed.

Syntax

{% comment %}
  content
{% endcomment %}

Inline comments

{% # content %}


Shopify Liquid liquid tag

Encloses multiple tags within one set of delimiters, to allow writing Liquid logic more concisely.

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
%}


Shopify Liquid echo tag

Using the echo tag is the same as wrapping an expression in curly brackets ({{ and }}). However, unlike the curly bracket method, you can use the echo tag inside liquid tags.

Syntax

{% liquid
  echo expression
%}

Example

{% echo product.title %}

{% liquid
  echo product.price | money
%}

Output

Health potion

$10.00


Shopify Liquid raw tag

Outputs any Liquid code as text instead of rendering it.

Syntax

{% raw %}
  expression
{% endraw %}

Example

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

Output

{{ 2 | plus: 2 }} equals 4.


Shopify Liquid Whitespace Control

In Liquid, you can include a hyphen in your tag syntax {{-, -}}, {%-, and -%} to strip whitespace from the left or right side of a rendered tag.

Example

{% assign username = "John G. Chalmers-Smith" -%}
{%- if username and username.size > 10 -%}
  Wow, {{ username -}} , you have a long name!
{%- else -%}
  Hello there!
{%- endif %}

Output

Wow, John G. Chalmers-Smith, you have a long name!