Templates: syntax
Overview
Templates are written in Jinja, populated with context variables from Markdown files and other sources. See Templates: context for more information on which context variables are available and Templates: examples for starter templates with examples of how to use Blurry's context variables.
Naming
Blurry templates should be named after a Schema.org type. For example, for a template for a regular web page, the template should be named WebPage.html after the WebPage Schema.org type.
Some common types you might use are:
See the "More specific Types" section of WebPage here for other WebPage subtypes, and the "More specific Types" section of CreativeWork for other common content types.
Custom template names
If your templates require more granularity than the Schema.org types, you can write templates with custom names and map them to Schema.org types using the template_schema_types setting in your blurry.toml configuration file:
[blurry.template_schema_types]
ContextWebPage = 'WebPage'
Blurry-included plugins
Blurry ships with some plugins to simplify writing templates.
{% blurry_image %}
This extension adds the {% blurry_image %} tag to simplify including images reference in Markdown front matter in your templates. It does a few things:
- Finds the image in your build directory
- Extracts the images width & height
- Builds an
<img>tag with width, height, and the othwer attributes specified in the tag
Examples
Basic example:
{% blurry_image page.image, alt=page.name + " image" %}
Example with explicit width (image with this width must be present in the build folder):
{% blurry_image page.image, 250, alt=page.name + " image", id="image-id", class="responsive-image", loading="lazy" %}