Search Documentation

Search for pages and headings in the documentation

Create Your First Page

Now that your collection is registered, let’s create pages and understand what makes them work.

Anatomy of a Page

Every markdown page has two parts:

1. Frontmatter (YAML metadata)

---
title: "My First Page"
description: "A brief description for search engines and previews"
---

These two fields are required:

  • title: The page title (displays in browser tab, breadcrumbs, sidebar)
  • description: Used for SEO and page metadata

2. Content (Markdown body)

# Heading

This is your content written in Markdown format.

## Subheading

You can use **bold**, _italic_, `code`, and more.

Creating Pages

Let’s create a few pages. Using your collection from the previous step (content/my-docs/):

Basic Structure

content/my-docs/
β”œβ”€β”€ guides/
β”‚   β”œβ”€β”€ hello.md                 # First page
β”‚   β”œβ”€β”€ installation.md          # Installation guide
β”‚   └── quick-start.md           # Quick start guide
└── concepts/
    β”œβ”€β”€ terminology.md           # Key terms
    └── architecture.md          # System design

Create the pages:

content/my-docs/guides/installation.md

---
title: "Installation"
description: "How to install and configure"
---

# Installation

Installation steps go here...

content/my-docs/concepts/terminology.md

---
title: "Key Terminology"
description: "Understanding important terms used throughout"
---

# Key Terminology

Define important terms for your documentation...

Page Slug and URL

The file path becomes your page URL:

File:    content/my-docs/guides/installation.md
Slug:    guides/installation
URL:     https://yourdocs.com/my-docs/guides/installation

Breaking this down:

  • content/my-docs/ - collection directory (from config)
  • guides/installation - becomes the slug
  • /my-docs/ - the route prefix (from config)

Optional Frontmatter

Besides the required fields, you can customize navigation:

---
title: "Installation"
description: "How to install"

# Override the sidebar label (if different from title)
navLabel: "Install"

# Add an icon (emoji or SVG reference)
navIcon: "⚑"

# Hide from navigation (page still accessible via URL)
navHidden: false

# Mark as work-in-progress
draft: false
---

Automatic Sidebar Discovery

Since you configured autoGenerated: true in your groups, these pages appear in the sidebar automatically, sorted alphabetically:

  1. Installation
  2. Quick Start
  3. (Any other pages you add)

To change the order, see Manual Configuration.

Next Steps

Now you know how to:

  • βœ… Create markdown files
  • βœ… Write frontmatter
  • βœ… Organize in folders
  • βœ… Have them appear automatically

Learn about: