Sidebar Navigation

By default, CelestialDocs sites include sidebar navigation. It is generated after parsing the folder structure of docs folder.

Custom order

By default, it will order the side navigation items (folders and files) alphabetically. But we can provide a custom order to the side navigation items.

In config.js you can set side_nav_menu_order with an order of items. Mind that the type is an array of strings. Each string is just the slug of that page.

// config.js

export const side_nav_menu_order: string[] = [
  "getting-started",
  "guides",
  "guides/pages",
  "guides/table-of-contents",
  "guides/sidebar-navigation",
  "custom-components",
  "reference",
];

You can include folder-name, md & mdx files. If you don’t order every items, then the left out folders and files will the ordered after that alphabetically. Don’t add extensions for md & mdx files.

You can find the slug of any page, if you simply run an instance of your project and look for the path after the port number in the url. For instance, the url in my local machine for this exact page is

http://localhost:4321/guides/sidebar-navigation

The slug will be guides/sidebar-navigation.

Hide Sidebar Navigation

Hide globally

In config.js, you can hide sidebar navigation by keeping the value of hide_side_navigations as true. This will hide the sidebar navigation for all pages.

// config.js

export const docconfig = {
  ...
  hide_side_navigations: true,
  ...
};

Hide locally

To hide sidebar navigation for specific pages only, then add hide_sidenav in the frontmatter as true.

---
hide_sidenav: true
---