Eleventy: Markdown converting to HTML but then being converted into entities.

[morgyface]

This my first time using 11ty and it is a joy, I'm loving it. I often embark on a mission of trying newer things in the dev world and give up due to assumptions being made about prior knowledge in documentation. 11ty is much more accessible and considered and whilst I’ve had my moments of frustration, I reckon I'm pretty close to getting my head round it all. However, I've hit a stumbling block which is almost definitely due to my own lack of knowledge, so my apologies if this is a daft issue/query.

I'm struggling to get markdown to display on the output pages as HTML.

The markdown is clearly being converted into html, however, it also looks like symbols are then, in-turn, being converted into HTML entities.

I've got a pretty standard 11ty set-up, my .eleventy.js configuration file contains only passthrough file copy stuff.

The page template is located in includes: _includes/general.njk and is Nunjucks. It contains standard html above and below a {{ content }} tag.

In the project root I have about.md which contains the following Front Matter data:

layout: general
title: About
tags: page
---

about.md also contains some markdown in the form of plain text without any paragraph tags and some subtitles written as ### Subtitle.

The html from the template itself renders perfectly, but the content from about.md is being converted to html and rendered but the symbols are subject to a second conversion, so that, for example, < is being turned into <

What I've tried so far:

1) Changing the default template engine, by adding the following to .eleventy.js...

module.exports = {
    markdownTemplateEngine: "njk"
};

2) Setting my own library instance and setting html: true and html: false.

Though still no joy. Any help would be hugely appreciated.

[vseventer]

@morgyface In your template, try using {{ content | safe }} rather than just {{ content }}.

[morgyface]

@vseventer I'm so grateful. That worked a treat. So what I was experiencing was double escaping and after reading this, I can see that whilst you can simply use {{ content }} in Liquid templates, in Nunjucks you need to use the safe filter:

which means that in an environment with automatic escaping enabled this variable will not be escaped.

Thanks again Mark.

[zachleat]

Here’s how it works in the various template languages! https://www.11ty.io/docs/layouts/#prevent-double-escaping-in-layouts

[zachleat]

This is an automated message to let you know that a helpful response was posted to your issue and for the health of the repository issue tracker the issue will be closed. This is to help alleviate issues hanging open waiting for a response from the original poster.

If the response works to solve your problem—great! But if you’re still having problems, do not let the issue’s closing deter you if you have additional questions! Post another comment and I will reopen the issue. Thanks!