11ty

Eleventy Documentation

This is an older version of Eleventy. Full release history. Go to the newest Eleventy docs. You could try /docs/languages/jstl/ although it may not exist.

Documentation Pages

JavaScript Template Literals

Template Languages:

Eleventy Short NameFile ExtensionNPM Package
jstl.jstlN/A

You can override a .jstl file’s template engine. Read more at Changing a Template’s Rendering Engine.

JavaScript Template Literal files behave like other Eleventy template languages: primarily because they support Front Matter and don’t necessarily look like JavaScript. However, for most use cases, it’s recommended to use the standard JavaScript template type, which has more comprehensive support for template literals.

For .jstl files, tagged templates are not yet supported. Use the JavaScript template type if you want to use tagged templates.

Read more about JavaScript Template Literals on MDN.

Samples #

This works the same as any other template. You can include front matter and everything outside the front matter will be parsed as a standard JavaScript Template Literal.

Filename name-sample.jstl
---
name: zach
---
<p>${name.toUpperCase()}</p>

While backticks around your template content are considered optional, you can include them if you’d like.

Filename name-sample-with-backticks.jstl
---
name: zach
---
`<p>${name.toUpperCase()}</p>`