diff --git a/organize/navigation.mdx b/organize/navigation.mdx index 27ea5cc95..ab60f8cd9 100644 --- a/organize/navigation.mdx +++ b/organize/navigation.mdx @@ -603,6 +603,54 @@ Breadcrumbs display the full navigation path at the top of pages. Some themes ha +## Products + +Products create distinct product divisions in your navigation, allowing you to organize documentation across multiple products or services. Products appear as a top-level navigation element that helps users navigate between different product areas. + +In the `navigation` object, `products` is an array where each entry is an object that requires a `product` field and can contain other navigation fields such as groups, pages, tabs, icons, or links to external pages. + +```json +{ + "navigation": { + "products": [ + { + "product": "Core API", + "icon": "square-terminal", + "groups": [ + { + "group": "Getting started", + "pages": ["core/overview", "core/quickstart"] + }, + { + "group": "Endpoints", + "pages": ["core/users", "core/orders"] + } + ] + }, + { + "product": "Analytics", + "icon": "chart-line", + "groups": [ + { + "group": "Setup", + "pages": ["analytics/setup", "analytics/configuration"] + }, + { + "group": "Reports", + "pages": ["analytics/reports", "analytics/dashboards"] + } + ] + }, + { + "product": "External Tools", + "icon": "external-link", + "href": "https://external-tools.example.com" + } + ] + } +} +``` + ## Interaction configuration Control how users interact with navigation elements using the `interaction` property in your `docs.json`.