How to escape liquid template tags?

Question

This sounds very easy, however I couldn't find it anywhere in the docs. How can I write {% this %} in a liquid template, without it being processed by the engine?

You can always [comment out.](https://stackoverflow.com/q/27007323/1934286) — user1934286, Apr 08 '20 at 20:09

Etienne · Answer 1 · 2012-12-01T08:54:41.263

137

it is possible to disable liquid processing engine using the raw tag:

{% raw  %}
{% this %}
{% endraw %}

will display

{% this %}

edited Dec 01 '12 at 08:54

answered Nov 27 '12 at 10:46

Etienne

16,249
3
26
31

I believe this used to be a [plug-in](https://gist.github.com/1020852). Did it get into the core engine in the meantime? – Attila O. Nov 30 '12 at 16:10
5

It looks like the `raw` tag has been added a year ago in the core engine. See https://github.com/Shopify/liquid/commits/master/lib/liquid/tags/raw.rb – Etienne Nov 30 '12 at 23:32
2

However, this escape is not supported by Github. – leiming Dec 29 '12 at 09:19
2

@LeiMing Looks like it is now (probably since [May 2013](https://github.com/blog/1502-jekyll-turns-1-0)) – atomicules Dec 09 '13 at 09:37
4

Confirmed, it works on GitHub Pages. The `raw` tag was [introduced in Liquid 2.3.0](https://github.com/jekyll/jekyll/issues/425) and GitHub Pages is currently using [version 2.5.5](http://pages.github.com/versions). – Enrico Campidoglio Mar 27 '14 at 22:34
One potential issue, if I want to print `{% endraw %}`, `{% raw %}{% endraw %}{% raw %}` won't render. – tartaruga_casco_mole Apr 01 '20 at 04:28

score 127 · Accepted Answer · edited Apr 25 '12 at 08:46

127

For future searchers, there is a way to escape without plugins, use the code below:

{{ "{% this " }}%}

and for tags, to escape {{ this }} use:

{{ "{{ this " }}}}

There is also a jekyll plugin for this which makes it a whole lot easier: https://gist.github.com/1020852

Raw tag for jekyll. Keeps liquid from parsing text betweeen {% raw %} and {% endraw %}

Reference

edited Apr 25 '12 at 08:46

Alan W. Smith

24,647
4
70
96

answered May 03 '11 at 07:29

Khaja Minhajuddin

6,653
7
45
47

1

Great, thanks for the reference. For some reason I wasn't able tno find this in the liquid docs. – Attila O. May 04 '11 at 11:57
10

You no longer need a plugin to use `{% raw %}`, for me it works out of the box and now it's in [the docs](https://github.com/Shopify/liquid/wiki/Liquid-for-Designers#wiki-raw) – fregante Feb 27 '14 at 15:33
2

is it possible to escape code with ``` instead of {% in jekyll? – Jas Dec 17 '14 at 08:42
3

The first couple suggestions didn't work for me, but using `raw` did: `{% raw %}{{ this }}{% endraw %}`. – Yevgeniy Brikman Jan 06 '15 at 18:29
it worked, thanks ... see a real example here http://g14n.info/2014/08/moving-from-blogger-to-github-pages/#comments – Gianluca Casati Apr 29 '15 at 22:10

score 15 · Answer 3 · edited Jul 01 '19 at 06:19

15

You can escape liquid tags in Jekyll posts using {% raw %} {% endraw %} i.e

{% raw %}
  {% for post in site.posts %}
     {{ post.content }}
  {% endfor %}

{% endraw %}

will produce

  {% for post in site.posts %}
     {{ post.content }}
  {% endfor %}

edited Jul 01 '19 at 06:19

Naveen

85
8

answered Nov 07 '16 at 19:44

Ahmed Bouchefra

256
2
4

score 14 · Answer 4 · answered Oct 18 '12 at 06:59

14

BTW:

If you want to display {{ "{% this " }}%}in Jekyll, you can code like this:

{{ "{{ " }}"{{ "{% this" }} " }}{{ "}}%}

To escape {{ "{{ this " }}}}use:

{{ "{{ " }}"{{ "{{ this" }} " }}{{ "}}}}

answered Oct 18 '12 at 06:59

leiming

494
4
13

33

Ha, ha hahahah ah aaaaahhh. – RobW Jul 16 '13 at 02:01

score 10 · Answer 5 · answered Dec 14 '15 at 11:40

There is another option: to use HTML special characters codes for replacing the curly braces with its matching codes:

replace each { with {

replace each } with }

For more details about this solution see: http://www.tikalk.com/devops/curly_brances_workaround/

score 4 · Answer 6 · answered Dec 30 '16 at 03:11

4

I found a omnipotent way to display any text with curly braces. You can assign plain text to a variable, and display it.

{% assign var = "{{ sth }}" %}
{{ var }}

answered Dec 30 '16 at 03:11

MoreFreeze

2,856
3
24
34

Thank you! Useful to escape double or single quotes – JumpLink Jan 06 '17 at 17:27

score 2 · Answer 7 · answered Jul 19 '19 at 23:05

As mentioned here also, plain {% raw %} and {% endraw %} are only the second best solution since those are shown if you look up the Markdown on normal github.com.

The best way is to put {% raw %} and {% endraw %} in HTML comments:

<!-- {% raw %} -->
something with curlky brackets like { this } and { that }
<!-- {% endraw %} -->

Due to the HTML comments it is seen by Github as a comment. In Github pages the raw tags will prevent the parsing of the curly brackets in between the tags.

I like this method as, for some reason, it doesn't mess with my excerpts. — Corstian Boerman, Aug 14 '20 at 15:15

score 1 · Answer 8 · answered Aug 17 '19 at 16:14

I tried {% raw %} something {% endraw %} ,

and {{ "{% this " }}%}. But they both don't work.

finally, my working answer is {{ "{%" xxx }} something }}.

My code:

{{ "{%" }} extends 'xadmin/base_site.html' %}
{{ "{%" }} block nav_form %}
    <h3>{{ "{{" }} title }}</h3>
    {{ "{%" }} for i in context1 %}
        <p>{{ "{{" }} i }}</p>
    {{ "{%" }} endfor %}
{{ "{%" }} endblock %}

The result:

{% extends 'xadmin/base_site.html' %}
{% block nav_form %}
    <h3>{{ title }}</h3>
    {% for i in context1 %}
        <p>{{ i }}</p>
    {% endfor %}
{% endblock %}

score 0 · Answer 9 · answered Apr 24 '22 at 05:35

0

Allows output of Liquid code on a page without being parsed.

{% raw %}{{ 5 | plus: 6 }}{% endraw %} equals 11.

{{ 5 | plus: 6 }} equals 11.

For more details about this solution see: https://www.shoplazza.dev/docs/theme-tags

answered Apr 24 '22 at 05:35

tim888

1

How to escape liquid template tags?

9 Answers9

Linked