Mark Llobrera

Eleventy: Escaping Nunjucks Statements in Markdown Code Blocks

A fun little wrinkle, but one with a very quick solution: if you have a code block containing any Nunjucks templates (and you’re using Nunjucks as your templating engine), you could end up with a TemplateContentRenderError. To get around it you can wrap the entire block in a {% raw %} [Stuff goes here] {% endraw %} block:

{% raw %}
<content type="html">
{% image metadata.feed_reading.img_base_url +, + " cover image" , "book_thumb" %}</p>
<p>Started Reading:
{{ | readableDate }}</p>
<p>Finished Reading:
{{ | readableDate }}</p>
{{ post.templateContent | safe }}]]>

{% endraw %}

To get the actual {% raw %} and {% endraw %} tags to render in the code block above, however, I had to add templateEngineOverride: md in the YAML front matter for this post, which tells Eleventy to only process Markdown, ignoring any Nunjucks tags1.

  1. As suggested in this Github issue. ↩︎