Helpers are functions accessible from pages and layouts that help to render the content. More info about how to create helpers in the Configuration page.
There are different types of helpers, the most common type is a filter.
Filters
Filters are functions that can be applied to variables to transform content. Nunjucks template engine has some builtin filters, for example:
<h1>{{ 'Welcome' | upper }}</h1>
Output:
<h1>WELCOME</h1>
Lume allows to create your own filters to be used by all template engines. New
filters must be registered in the _config.js
file:
// Filter to prepend a 👍 to any text
site.filter("thumbsUp", (value) => "👍 " + value);
Now this filter is available in your layouts:
<h1>{{ 'Welcome' | upper | thumbsUp }}</h1>
Output:
<h1>👍 WELCOME</h1>
Builtin filters
Lume includes the following convenient preinstalled filters:
- md: Allows to render Markdown content to HTML. More info
- njk: Allows to render Nunjucks content to HTML. More info
- url / htmlUrl: Allows to normalize URLs. More info
Using the filters in JavaScript modules
If you're using JavaScript/TypeScript modules instead of a template engine like Nunjucks, filters are passed as the second argument of your default exported function:
export default function (data, filters) {
return `<a href="${filters.url("/about-us")}">About us</a>`;
}
Tags
{% uppercase %}
Hello, {{ user.name }}
{% enduppercase %}
See Helpers configuration for more information about how to create your own tags.