# Organize navigation (/editor/navigation)

<!-- agent-signals: reading_time_min: 2 · est_tokens: 691 · updated: 2026-07-30 -->
Related: [How to use the editor](/editor/tutorial.md), [Git essentials for the editor](/editor/git-essentials.md), [Create and edit pages](/editor/pages.md), [Live preview](/editor/live-preview.md), [Branching and publishing](/editor/branching-and-publishing.md), [Comment on pages in the editor](/editor/comments.md)

Use the navigation sidebar to organize your documentation. Changes you make in the editor sync to your repository when you publish—you don't need to edit `docs.json` manually.

## Add navigation elements [#add-navigation-elements]

Click **Add new** at the bottom of the navigation tree to add a new element at the root level. To add an element nested inside another, click the <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12.001 5.00003V19.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/><path d=&#x22;M19.002 12.002L4.99998 12.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> plus button next to that element.

Drag and drop elements to reorder or nest them. Hover over an element and click the gear icon to configure its properties.

Right-click a **page** to open its settings or delete it.

Right-click a **navigation element** to open its settings, convert it to a different element type, duplicate it, add a page inside it, add a group inside it, ungroup it, or delete it.

<Note>
  Some elements cannot nest inside other elements. For example, tabs cannot nest inside groups. The editor prevents you from creating invalid combinations.
</Note>

## Navigation elements [#navigation-elements]

Choose the right structure for your content:

* **Pages**—Individual documentation files. The core building block of navigation.
* **Groups**—Collapsible sections that cluster related pages together. Can nest within other groups.
* **Tabs**—Top-level sections with horizontal navigation at the top of your site. Use tabs when you have distinct areas like API Reference and Guides.
* **Anchors**—Persistent items at the top of your sidebar. Useful for quick access to external resources or top-level sections. Can be global to appear on every page.
* **Dropdowns**—Expandable menus at the top of your sidebar. A lighter alternative to tabs for multiple related sections.
* **Menus**—Dropdown navigation items within a tab for direct links to specific pages.
* **Products**—A switcher for multiple distinct product documentation sets, each with its own navigation structure.
* **Versions**—A switcher for multiple simultaneous documentation versions.
* **Languages**—A switcher for documentation in multiple languages.

## Configure elements [#configure-elements]

Hover over any navigation element and click the gear icon to set:

* **Title**: The label shown in the sidebar.
* **Icon**: A visual marker next to the label.
* **Tag**: A badge like "NEW" or "BETA" to highlight the item.