Shortcode does not render HTML

[mathiasha]

In my eleventy config I have this shortcode:

module.exports = function(eleventyConfig) {
  eleventyConfig.addShortcode("testCode", function(name) {
    return `<div class="some-class">${name}</div>`;
  });
}

In my handlebars file I have this
{{ testCode 'Mathias' }}

But the shortcode is being rendered as a string. So in the browser it looks like this

<div class="some-class">Mathias</div>

Am I doing something wrong?

[corderophi678]

It looks like you might be escaping the backticks in your return statement? Might that be the cause?

[zachleat]

This is a good question! Handlebars escapes shortcodes by default so you want the triple-stash for unescaped output {{{ testCode 'Mathias' }}}.

[zachleat]

I will update the documention for shortcodes to make this clearer.

[zachleat]

Both https://www.11ty.io/docs/languages/handlebars/ and https://www.11ty.io/docs/shortcodes/ have been updated with this information.

Thanks for filing this! Very helpful!