The side navigation defines the primary structure of your documentation site. It is configured using a single file: config/sidenav.yaml. This file controls the order, hierarchy, and grouping of all pages in your documentation.

Basic configuration

Below is a simple example of a side navigation configuration:

- label: Home
  path: /
- label: Flight School
  path: /flight-school
  children:
    - label: Primer — What “Lightspeed” Means Here
      path: /flight-school/primer
    - label: Navigation — Folding a Straight Line
      path: /flight-school/navigation

Each item in the file represents a navigation entry in the sidebar.

Navigation item properties

Every navigation item supports the following properties:

Rules:

• label is always required.
• path is required only if the item should link to a page.
• children is optional and used to create nested navigation.

Navigation patterns

Page with content

A basic navigation item that links directly to a page:

- label: Flight School
  path: /flight-school

This maps to:

content/en/flight-school.md

Parent with content and children

A parent item can have its own page and child pages.

- label: Flight School
  path: /flight-school
  children:
    - label: Primer — What “Lightspeed” Means Here
      path: /flight-school/primer
    - label: Navigation — Folding a Straight Line
      path: /flight-school/navigation

File structure:

content/en/
├── flight-school.md
└── flight-school/
    ├── primer.md
    └── navigation.md

The parent label links to /flight-school, while child items link to their respective pages.

Parent as label only

A parent can also be used purely as a visual grouping, without its own page.

- label: Prerequisites
  children:
    - label: Install Node.js
      path: /prerequisites/nodejs
    - label: Install Git
      path: /prerequisites/git

Key difference:

The parent does not define a path.

File structure:

content/en/
└── prerequisites/
    ├── nodejs.md
    └── git.md

Nested navigation

Two-level navigation

- label: API Reference
  path: /api
  children:
    - label: Authentication
      path: /api/authentication
    - label: Users
      path: /api/users
    - label: Projects
      path: /api/projects

Multi-level navigation

Mordoc supports deeper nesting when needed:

- label: Documentation
  path: /documentation
  children:
    - label: Getting Started
      path: /documentation/getting-started
      children:
        - label: Installation
          path: /documentation/getting-started/installation
        - label: Configuration
          path: /documentation/getting-started/configuration
    - label: Advanced
      path: /documentation/advanced

Path mapping

Paths defined in sidenav.yaml map directly to markdown files in your content directory.

Path rules:

• Paths must start with /
• Do not include .md
• Match the folder structure under content/
• Use lowercase letters and hyphens

Styling the side navigation

If you want to customize side navigation colors to better match your brand, you can do so by adding a sidenav.json file under the config/styles/ directory.

This file allows you to control how side navigation active items appear in both light and dark modes.

{
  "navHoverBackgroundLight": "#E5E5E5",
  "navHoverBackgroundDark": "#1F1F1F",
  "navActiveBackgroundLight": "#E5E5E5",
  "navActiveBackgroundDark": "#1F1F1F",
  "navActiveTextColorLight": "#171717",
  "navActiveTextColorDark": "#FAFAFA"
}

Available style variables