Escape Liquid in ConvertKit (so you can use double braces)

By Dave Ceddia

Need to use double braces in your ConvertKit email? Maybe you’re trying to write some code, and the braces are getting stripped out along with everything inside.

Here’s the easy fix:

Before the opening double braces, add {% raw %}.

After the closing braces, add {% endraw %}.

Example of Escaping Double Braces in ConvertKit Liquid

I had this problem myself – some of my email content was getting stripped out, ending up like this:

<CustomButton
  green={true}
  width={64}
  options=
  onClick={doStuffFunc}
/>

And here’s what it was supposed to be, with more text on the options= line:

<CustomButton
  green={true}
  width={64}
  options={{ awesome: "yes", disabled: "no" }}
  onClick={doStuffFunc}
/>

To get that result, I changed the text of the email to wrap the double braces in a raw/endraw block:

<CustomButton
  green={true}
  width={64}
  options={% raw %}{{ awesome: "yes", disabled: "no" }}{% endraw %}
  onClick={doStuffFunc}
/>

And now it works great :)

Bonus: How to Write {% raw %} if you really really have to

If you need to write almost any other Liquid in your emails, and want it to appear as-is in the actual email, wrapping it in {% raw %} + {% endraw %} will do it.

But what if you want to literally include the text {% raw %} in an email?

(I had to figure this out in order to write this post, because my blog also uses Liquid for templating!)

Fair warning, this will probably hurt your eyes and brain. It hurt mine. Here’s how it do it:

{{ "{% raw" }} %}

and

{{ "{% endraw" }} %}

Here’s why this works:

{{ "{% raw" }} %}

  • The double braces are actually a Liquid expression (the whole yellow part)
  • Inside the double braces is a string surrounded by double quotes (in orange). The quotes get removed before the text is inserted into the page.
  • The final closing %} is plain old text, since it’s outside of the double braces. It doesn’t mean anything special to Liquid.

Liquid-ception.