hakyllbars: advanced templates for hakyll

Helper functions

Variables that are functions may be applied to one or more arguments. As in Haskell, arguments are separated by whitespace.

Functions may be applied and then piped forward as arguments to other expressions by using the | operator.

<a href="{{getAbsUrl 'sitemap.xml' | htmlEscape}}">Sitemap</a>

This is equivalent to writing:

<a href="{{htmlEscape (getAbsUrl 'sitemap.xml')}}">Sitemap</a>

Helper functions are also used to define syntax, as in conditionals and loops.

dateAs

Use this helper function with the following date format variables in this syntax:

dateVariable | dateAs formatVariable
longDate
"%B %e, %Y %l:%M %P %EZ"
shortDate
"%B %e, %Y"
timeOnly
"%l:%M %p %EZ"
robotDate
"%Y-%m-%d"
robotTime
"%Y-%m-%dT%H:%M:%S%Ez"

Live examples

{{created | dateAs longDate}}
January 28, 2023 9:53 am -08:00
{{created | dateAs shortDate}}
January 28, 2023
{{created | dateAs timeOnly}}
9:53 AM -08:00
{{created | dateAs robotDate}}
2023-01-28
{{created | dateAs robotTime}}
2023-01-28T09:53:41-08:00

escapeHtml

Stringifies and escapes its argument for interpolation into HTML. Use with the following syntax:

<img alt="{{imgAlt | escapeHtml}}" title="{{imgTitle | escapeHtml}}" src="...">

Live examples

{{'<em>Hello, World!</em>' | escapeHtml}}
&lt;em&gt;Hello, World!&lt;/em&gt;

getAbsUrl

Gets the absolute URL to a given item file path relative to the host and siteRoot variables using the form {{host}}/{{siteRoot}}/{{getUrl itemPath}}. This helper also strips the trailing index.html from the URL.

<!-- given:
host: "https://website.com"
siteRoot: blog
-->
<a href="{{getAbsUrl 'recipes.md'}}">Recipes</a>

<!-- interpolates as... -->
<a href="https://website.com/blog/recipes.html">Recipes</a>

Live examples

{{getAbsUrl 'index.md'}}
https://keywordsalad.github.io/hakyllbars/
{{getAbsUrl 'helper-functions.md'}}
https://keywordsalad.github.io/hakyllbars/helper-functions/
{{getAbsUrl 'js/main.js'}}
https://keywordsalad.github.io/hakyllbars/js/main.js

getUrl

Gets the URL to a given item file path relative to the siteRoot variable using the form {{siteRoot}}/{{getUrl itemPath}}. This helper also strips the trailing index.html from the URL.

<!-- given:
siteRoot: blog
-->
<a href="{{getUrl 'recipes.html'}}">Recipes</a>

<!-- interpolates as... -->
<a href="/blog/recipes.html">Recipes</a>

Live examples

{{getUrl 'index.md'}}
/hakyllbars/
{{getUrl 'helper-functions.md'}}
/hakyllbars/helper-functions/
{{getUrl 'js/main.js'}}
/hakyllbars/js/main.js

linkedTitle

Creates a link to a given item file path with its title as the value, using the associated hakyll route.

<!-- given:
title: How to link a blog post
date: 2023-01-23
-->
{{linkedTitle 'blog/how-to-link.md'}}

<!-- interpolates as... -->
<a href="/blog/2023/01/23/how-to-link/index.html">How to link a blog post</a>

Live examples

{{linkedTitle 'index.md'}}
Why another templating language?
[Why another templating language?](/hakyllbars/ "Why another templating language?")
{{linkedTitle 'helper-functions.md'}}
Helper functions
[Helper functions](/hakyllbars/helper-functions/ "Helper functions")

put

Puts one or more variables into the current context. The variables will be propagated to any following included templates.

{{put fruit: "banana"}}
Fruit is: _{{fruit}}_

<!-- interpolates as... -->
<p>Fruit is: <em>banana</em></p>

Live examples

{{put fruit: "banana", vegetable: "tomato" }}
Fruit is _{{fruit}}_, vegetable is _{{vegetable}}_.

Fruit is banana, vegetable is tomato.

putBlock

Puts an inline template into a variable. Note that this helper function requires the # prefix.

<!-- given:
fruit: banana
-->
{{#putBlock "inlinePartial"}}
  This content will be captured here, with a fruit: _{{fruit}}_.
{{#end}}
{{inlinePartial}}

<!-- interpolates as... -->
<p>This content will be captured here, with a fruit: <em>banana</em>.

Live examples

This content will be captured here, with a fruit: banana.

addBlock

Creates a list of inline templates or adds a template to an existing list. Note that this helper function requires the # prefix.

<!-- given:
firstFruits: apples
secondFruits: oranges
-->
{{#addBlock "fruits"}}
  This is the first fruit: _{{firstFruit}}_.
{{#end}}
{{#addBlock "fruits"}}
  This is the second fruit: _{{secondFruit}}_.
{{#end}}
{{fruits}}

<!-- interpolates as... -->
<p>This is the first fruit: <em>apples</em>.</p>
<p>This is the second fruit: <em>oranges</em>.</p>

Live examples

This is the first fruit: apples.

This is the second fruit: oranges.