Managing Docs with Zola
Recommended structure and front-matter conventions for maintaining docs in Zola.
Use these conventions to keep Agentty documentation maintainable as it grows.
Keep URLs Stable🔗
- Keep documentation under the
content/docs/section. - Keep the section directory named
docsso its canonical route remains/docs/. - When moving or renaming pages, add
aliasesin page front matter to preserve old links. - For paragraph-level deep links, add explicit HTML anchors in content (for example,
<a id="some-paragraph-id"></a>before the paragraph). - Paragraph anchors automatically render a
#affordance next to the paragraph so users can copy deep links directly.
Use Section Metadata Deliberately🔗
- Set
sort_by = "weight"and define pageweightvalues for intentional ordering. - Keep
page_templateon the docs section so all guides share a consistent layout. - Keep
build_search_index = true, use thefuse_jsonformat in the[search]configuration, and keep documentation pages in the index. - The shared navigation searches documentation, feature pages, and blog posts. The documentation sidebar uses the same generated index and filters its results to
/docs/routes.
Preserve the Site Design System🔗
- Treat
sass/site.scssas the source of truth for semantic color, typography, radius, layout, and motion tokens. Extend an existing token before adding a raw visual value. - Keep the terminal identity in the ASCII mark, monospace labels, code, prompts, and demo frames. Use the sans-serif stack for prose and larger interface headings.
- Use
--color-textfor primary content,--color-mutedfor supporting prose, and--color-dimonly for short metadata. Interactive boundaries should use--color-border-strong, and keyboard focus should use--color-focus. - Preserve the shared
:focus-visibletreatment and test both thegreenanddarkthemes when adding controls. - Keep animated feature images behind the
data-motion-demoloader so off-screen media remains deferred. Pair each GIF with a same-named PNG poster soprefers-reduced-motionusers receive a meaningful static preview. Regenerate and visually inspect the poster whenever its GIF changes.
Scale with Nested Sections🔗
- Group larger topics into nested sections (
content/docs/<topic>/_index.md). - Render navigation from
get_section(...).subsectionsso new sections appear automatically. - Use
transparent = trueonly when subsection pages should be merged into the parent listing.
Prefer Mermaid for Diagrams🔗
- Use fenced
mermaidcode blocks for flow, lifecycle, and architecture diagrams instead of ASCII trees. - Keep node labels concise and let the docs-page template handle theme-aware Mermaid rendering.
- Mermaid diagrams in docs pages now ship with built-in
fit, zoom, and drag-to-pan controls automatically, so authors do not need to add extra wrapper markup.
Add a Feature Entry🔗
The /features/ page auto-discovers entries from individual .md files in content/features/. To add a new feature:
- Add an E2E feature test with the
FeatureTestbuilder incrates/agentty/tests/e2e/. - Place the generated GIF in
static/features/.FeatureTestwrites this when VHS is installed; if GIF generation is skipped, do not add or keep the feature page until the matching asset exists. - Create
content/features/<name>.mdwith the following front matter:+++ title = "Feature title" description = "One-line description shown on the card." weight = <ordering number> [extra] gif = "<name>.gif" +++ - Choose a
weightthat slots the entry into the desired display position (lower weights appear first). - Run
zola checkto verify the features page renders the new entry.
The features.html template uses get_section(path="features/_index.md") and iterates section.pages ordered by weight. The homepage feature card in index.html is hardcoded and curated separately.
Authoring Workflow🔗
- Create a new Markdown page under
content/docs/. - Add
title,description, andweightfront matter. - Add a
<!-- more -->break so docs listings show concise summaries. - Use Zola
@/...links for internal Markdown pages so renamed or missing targets fail validation instead of producing deployed.mdlinks. - Keep every pipe-table header, delimiter, and body row on its own source line. Prefer short titled blocks when cells need full sentences.
- Run
zola checkbefore publishing, then test sidebar search with a title and a term that appears only in page content.