Multi-Tab Sites — Sourcey

Sourcey supports multiple tabs, each with its own content source: markdown groups, an OpenAPI spec, or Doxygen XML. Tabs appear in the top navigation and define independent URL namespaces.

Tab types

Each tab has exactly one content source:

Source	Config field	Use case
Markdown groups	`groups`	Guides, tutorials, concepts, changelogs
OpenAPI spec	`openapi`	Auto-generated API reference
Doxygen XML	`doxygen`	C/C++ API reference

Example: four-tab site

import { defineConfig } from "sourcey";

export default defineConfig({
  name: "My Platform",
  navigation: {
    tabs: [
      {
        tab: "Documentation",
        slug: "",
        groups: [
          {
            group: "Getting Started",
            pages: ["introduction", "quickstart"],
          },
          {
            group: "Concepts",
            pages: ["architecture", "authentication"],
          },
        ],
      },
      {
        tab: "Guides",
        groups: [
          {
            group: "Tutorials",
            pages: ["guide-setup", "guide-deployment"],
          },
        ],
      },
      {
        tab: "API Reference",
        slug: "api",
        openapi: "./openapi.yaml",
      },
      {
        tab: "Changelog",
        groups: [
          {
            group: "Updates",
            pages: ["changelog"],
          },
        ],
      },
    ],
  },
});

How slugs work

Each tab has a URL slug. Pages within a tab are prefixed with that slug.

{ tab: "Documentation", slug: "" }

Pages live at the root: /introduction, /quickstart.

Use this for your primary tab to keep URLs short.

{ tab: "Guides", slug: "guides" }

Pages are prefixed: /guides/guide-setup, /guides/guide-deployment.

When slug is omitted, it defaults to the slugified tab name.

{ tab: "API Reference", slug: "api" }

Override the auto-generated slug for cleaner URLs: /api/ instead of /api-reference/.

Tip

Set slug: "" on your primary documentation tab. This puts the most-visited pages at the shortest URLs.

Groups within tabs

Groups organize pages in the sidebar. Each group gets a section header.

groups: [
  {
    group: "Getting Started",    // sidebar section header
    pages: ["introduction", "quickstart"],
  },
  {
    group: "Advanced",
    pages: ["architecture", "performance"],
  },
]

Pages appear in the sidebar in the order they're listed. Groups appear in the order they're defined.

Real-world example

The Cheese Store demo uses exactly this pattern: four tabs (Documentation, Guides, API Reference, Changelog), each with its own content source. The Documentation tab uses slug: "" for root-level URLs, the API Reference tab uses openapi for auto-generated docs, and the Guides tab organizes pages into sidebar groups. View the live site or clone the repo to explore the config.