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.

Normally, even if it doesn't output text, any line of Liquid in your template will still output an empty line in your rendered HTML:

Input {.input}

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

Notice the empty line before "tomato" in the rendered template:

Output {.output}

tomato
By including hyphens in your `assign` tag, you can strip the generated whitespace from the rendered template:

Input {.input}

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

Output {.output}

tomato
If you don't want any of your tags to output whitespace, as a general rule you can add hyphens to both sides of all your tags (`{%-` and `-%}`):

Input {.input}

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

Output without whitespace control {.output}

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

Input {.input}

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

Output with whitespace control {.output}

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