elf-notes/content/docs/zola-cookbook/_index.md

68 lines
1.5 KiB
Markdown
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

+++
title = "Zola Cookbook"
description = "Snippets I've developed that I want to keep"
date = 2022-04-27T18:00:00+00:00
updated = 2022-04-27T18:00:00+00:00
template = "docs/section.html"
sort_by = "weight"
weight = 5
draft = false
[taxonomies]
documentation=["Reference"]
categories=["Web Development", "Static Site Generation", "Zola"]
+++
[Zola](../zola) is the static site generator I use for most of my websites that
don't require much dynamic functionality.
## Generating Nested Lists from Data
Example data:
```html
{
"definitions": [
{ "dt": "undefined", "dd": " the thing is undefined." },
{ "dt": "defined", "dd": " the thing is defined.", definitions: [
{ "dt": "truthy", "dd": "the defined thing is truthy" },
{ "dt": "falsy", "dd": "the defined thing is falsy" }
]}
]
}
```
Tera macro to render a nested list:
```
{% macro definition_body(source) %}
<dl>
{% for entry in source %}
<dt><kbd>{{ entry.dt | safe }}</kbd></dt>
<dd>
{{ entry.dd | safe }}
{% if entry.definitions %}
{{ self::definition_body(source=entry.definitions) }}
{% endif %}
</dd>
{% endfor %}
</dl>
{% endmacro %}
```
Zola shortcode to import the macro template into Markdown and start the render:
```
{%- import 'macros/definition_body.html' as renderer -%}
<div>
{% set content = load_data(path=source) %}
{{ renderer::definition_body(source=content.definitions) }}
</div>
```
Invocation in Markdown file, providing the data source:
```
{{ definition_list(source="@/docs/zola/definitions.json") }}
```