Search code examples
htmlmarkdownnetlifynunjuckseleventy

Markdown/html not parsing correctly in eleventy from frontmatter generated by Netlify CMS

I've been stuck on this for an embarrassingly long time. I have two inputs that aren't displaying correctly, a markdown widget and the list widget. They both appear as one long string. I thought I needed to add a markdown parser for the former at least so I'm using markdown-it in a manner similar to this:

https://github.com/11ty/eleventy/issues/236

It is adding paragraph breaks where they should be but they show up on the page as p tags. I thought this was because I already had the parsed text nested between p tags but if I delete those nothing shows up at all. When I look at the html file created by eleventy, the tags show up as "&lt ;p&gt ;" (without the spaces) which it seems the browser isn't reading correctly when trying to interpret the html. I'm using nunjucks for templating if that matters. My .eleventy.js file looks like this currently. What am I missing? Also the markdown filter seems to only want to take a string so I'm not sure where to even begin with the list.

enter image description here

Solution

  • By default, Nunjucks HTML-escapes all variables when outputting templates. This is what you want most of the time, unless you're trying to render HTML input.

    You might want to try using the safe filter after your markdownify filter.

    {{ markdownContent | markdownify | safe }}