Serene post template

#template#markdown#serene

This is a living template for future posts. Copy this file, remove the sections you do not need, and replace the example text with your own.

Headings and inline formatting

Use headings to organize a long post. Text can be bold, italic, struck through, or inline code. You can add links, automatic URLs such as https://www.getzola.org, and images.

Lists

Unordered list:

  • A short item
  • An item with emphasis
    • A nested item

Ordered list:

  1. Research the problem
  2. Implement the solution
  3. Measure the result

Task list:

  • Write the first draft
  • Review the draft
  • Publish the post

Blockquotes and alerts

A normal blockquote is useful for quoting a person, a paper, or a useful idea.

Use a note for context that helps the reader.

Use a tip for a practical recommendation.

Use important for a requirement the reader should not miss.

Use warning for a risky operation or a likely mistake.

Use caution for a destructive or irreversible operation.

Tables

FeatureUse it forEnabled here
MarkdownMost writingYes
KaTeXEquationsYes
MermaidDiagramsYes
ComponentsRicher blocksYes

Code blocks

Inline code is useful for short names. Fenced code blocks support syntax highlighting:

from pathlib import Path

def word_count(path: str) -> int:
    return len(Path(path).read_text().split())

Code annotations are also supported:

fn main() {
    let message = "Hello, Serene"; // [!code highlight]
    println!("{message}");
}

When documenting Tera syntax, wrap the example in raw so Zola does not evaluate it:

{{ <figure src="/img/example.png" alt="Example" /> }}

Images

The figure component adds dimensions, alt text, and a caption:

A small blue and green landscape illustration

A local image can be colocated with the post. Captions support Markdown.

You can also use regular Markdown images:

A local Serene template illustration

Mathematics

Set math = true in the front matter to enable KaTeX. Inline math looks like $E = mc^2$. Display math uses double dollar signs:

$$ \int_0^1 x^2,dx = \frac{1}{3} $$

Mermaid diagrams

Set mermaid = true to render diagrams:


flowchart LR
    A[Draft] --> B{Review}
    B -->|Revise| A
    B -->|Approve| C[Publish]

Serene components

Use a styled quote when a citation should stand out:

Make every section earn its place.

— A useful writing rule

Use a detail block for optional context:

Show the implementation notes

This content is hidden until the reader opens it. It is useful for caveats, long explanations, or implementation details that would interrupt the main flow.

You can embed a YouTube video with a video ID:

Footnotes

Footnotes keep supporting details out of the main sentence.1 You can also reuse a named footnote.2

1

This is a regular footnote.

2

Footnotes can contain links, such as Zola's documentation.

A final checklist

Before publishing a real post:

  1. Replace the title, description, date, and tags.
  2. Keep only the front matter flags you actually need.
  3. Give every image useful alt text and explicit dimensions when using figure.
  4. Test math, diagrams, embeds, and links with zola serve.
  5. Remove this tutorial post when it is no longer useful.