Homepage

Liquid - Whitespace Control

Last edit: Oct 26, 2022

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

Normally, even if it doesn’t output text, any line of Liquid in your template will still output a blank line in your rendered HTML:

Input


{% assign my_variable = "tomato" %}
{{ my_variable }}

Notice the blank line before “tomato” in the rendered template:

Output


tomato

Trim whitespace before

Using a hyphen on opening tags ({{- and {%-) will trim white space from the content before the tag.

Input


Start


My paragraph


{{- 'The end.' }}

Output

Start


My paragraphThe end.

Trim whitespace after

Using a hyphen on closing tags (-}} and -%}) will trim white space from the content after the tag.

Input


{{ 'Start' -}}


My paragraph


The end.

Output

StartMy paragraph

The end.

Trim whitespace before and after

Using hyphens on both opening and closing tags ({{-, -}}, {%-, and -%}) will trim white space from both sides of the tag.

Input


{{ 'Start' -}}


My paragraph


{{- 'The end.' }}

Output

StartMy paragraphThe end.

Note

This topic is a compilation of knowledge found at: Shopify Themes, Liquid Documentation, Liquid Gem Documentation, and Liquid for Designers.

Questions?

We are always happy to help with any questions you may have.

contact us