Multi-Sidebar

The theme ships @lorenzo_lewis/starlight-utils as a dependency, making it easy to set up independent sidebars for different content sections.

Setup

Add starlightUtils to your Starlight plugins alongside the theme:

import starlightUtils from "@lorenzo_lewis/starlight-utils";

export default defineConfig({
  integrations: [
    starlight({
      plugins: [
        starlightCelestiaTheme(),
        starlightUtils({
          multiSidebar: {
            switcherStyle: "horizontalList",
          },
        }),
      ],
      sidebar: [
        {
          label: "Guide",
          autogenerate: { directory: "guide" },
        },
        {
          label: "API",
          autogenerate: { directory: "api" },
        },
      ],
    }),
  ],
});

Switcher Styles

Horizontal List

The default style. Renders tabs above the sidebar content.

Dropdown

A compact dropdown menu for switching between sidebars.

starlightUtils({
  multiSidebar: {
    switcherStyle: "dropdown",
  },
});

Hidden

Hides the switcher entirely. Useful when combined with top navigation links.

starlightUtils({
  multiSidebar: {
    switcherStyle: "hidden",
  },
});

Sidebar Configuration

Groups

Each top-level entry in the sidebar array must be a group with a label. Bare links at the top level are not supported.

Auto-generate

Use autogenerate to populate a sidebar group from a directory:

{
  label: 'Guide',
  autogenerate: { directory: 'guide' },
}

Badges

Groups support Starlight’s badge system:

{
  label: 'API',
  badge: 'New',
  autogenerate: { directory: 'api' },
}