6. Expose markdown renderer as built-in filter

Nam

Nam Hoang / Sep 24, 2021

2 min read

Install markdown-it

yarn add -D markdown-it

Add a paired Shortcode

And if you didn't want to use and intermediate { % set % } (Nunjucks) or { % capture % } (Liquid), you could use a paired shortcode:

let markdown = require('markdown-it')({
  html: true,
});

module.exports = function (eleventyConfig) {
  eleventyConfig.addPairedShortcode('markdown', (content) => {
    return markdown.render(content);
  });

  return {
    dir: {
      input: 'src',
      output: '_site',
    },
  };
};
<h1>Markdown in Nunjucks</h1>

{ % markdown % }
{ %- include "my-markdown.md" - % }
{ % endmarkdown % }