Add / Edit Content

Create or modify content pages in content/. Each .md file becomes an HTML page at build time. The file path determines the URL; frontmatter determines everything else.

When to Use

• •Adding a new page, blog post, section index, or product
• •Editing frontmatter fields (title, parent, labels, etc.)
• •Adding :::children, :::html, or HTMX links to a page

Procedure

1. Pick the file path

2. Write frontmatter

Every file must have Short-URI. See references/frontmatter-fields.md for all fields.

---
title: My Page Title
Short-URI: my-page
Template: default
Type: page
Parent: root
Order: 3
Category: General
Labels: [tutorial, beginner]
Description: A short SEO summary
---

• •Parent: root → appears in top navigation
• •Parent: <section-short-uri> → child of that section
• •Type: section → container page, use :::children in body
• •Type: product → requires PriceCents, Currency, StripePriceId, Image

3. Write the Markdown body

Standard GFM Markdown. Extend with three directives:

Auto-list child pages:

:::children sort=date-desc limit=5
:::

Raw HTML block:

:::html
<div hx-get="/fragments/demo.html" hx-target="#output">
  <button class="bg-blue-600 text-white px-4 py-2 rounded">Click Me</button>
  <div id="output"></div>
</div>
:::

HTMX link:

[Load Data](/fragments/data.html){hx-get hx-target=#output hx-swap=innerHTML}

See references/directives.md for full options and placeholders.

4. Validate

• •Short-URI is unique across all content files
• •Parent matches an existing section's Short-URI or is root
• •Template matches a file in templates/ (without .html)
• •Type is one of: page, post, section, product
• •Section indexes include a :::children directive
• •Products have all four product fields

5. Build

bun run build

Constraints

• •No <style> or <link> tags — use Tailwind in :::html blocks
• •No <script> blocks — client JS goes in src/client/
• •No nested ::: blocks — first ::: closes the block
• •No Markdown inside :::html — it's raw HTML only
• •No hard-coded nav links — navigation is auto-generated from Parent + Order
• •No HTML cards for data a component already renders — put structured data in frontmatter and let {{tag}} components render it (e.g. Skills: array → {{skill-cards}}, product fields → {{product}})

References

• •references/frontmatter-fields.md — Complete field reference with types and defaults
• •references/directives.md — :::children, :::html, and HTMX syntax details
• •references/examples.md — Full page examples (blog post, product, section index)