Skip to content
Last updated

products

Use the products section to set up multiple product documentation sets in your project. This option configuration creates a product picker in the navbar and offers the ability to customize the look of each product's documentation set.

Screenshot with product picker in navbar

Options

OptionTypeDescription
productsMap of strings to ProductREQUIRED Map of strings allows for the definition of multiple products. Strings represent product only in configuration file - they do not appear in published product. Example: acme-us

Product object

OptionTypeDescription
namestringREQUIRED Name of the product that appears in product picker. Example: Acme
iconstringPath to the product icon file. Displays next to the product name in product picker.
folderstringREQUIRED Path to the product content folder. Cannot be a subfolder in another product's folder.

Examples

Basic multi-product setup

The following example shows a simple multi-product configuration:

redocly.yaml
products:
  acme:
    name: Acme
    folder: products/acme/
  museum:
    name: Museum
    folder: products/museum/

Complete multi-product configuration

The following example shows a comprehensive multi-product setup with icons and proper folder structure:

redocly.yaml
products:
  platform:
    name: Platform API
    icon: images/platform-icon.svg
    folder: products/platform/
  mobile:
    name: Mobile SDK
    icon: images/mobile-icon.svg
    folder: products/mobile/
  integrations:
    name: Integrations
    icon: images/integrations-icon.svg
    folder: products/integrations/

This configuration creates a product picker in the navbar and organizes content as follows:

project/
├──images/
│   ├──platform-icon.svg
│   ├──mobile-icon.svg
│   └──integrations-icon.svg
├──products/
│   ├──platform/
│   │   ├──index.md
│   │   ├──api-reference.yaml
│   │   └──redocly.yaml        # Optional product-specific config
│   ├──mobile/
│   │   ├──index.md
│   │   ├──guides/
│   │   └──sidebars.yaml       # Product-specific navigation
│   └──integrations/
│       ├──index.md
│       └──webhooks.yaml
├──index.md                    # Project landing page
└──redocly.yaml               # Main configuration

Product-specific configuration

Each product folder can include its own redocly.yaml file to customize that product's documentation. Product-specific configurations override the root configuration for:

  • breadcrumbs
  • codeSnippet
  • feedback
  • footer
  • logo
  • navbar
  • sidebar
  • search
products/platform/redocly.yaml
# Platform-specific customization
navbar:
  items:
    - page: index.md
      label: Platform Overview
    - page: api-reference.yaml
      label: API Reference
    - page: guides/index.md
      label: Platform Guides

footer:
  copyrightText: "© 2024 Platform Team. All rights reserved."

Search behavior in multi-product

When users search from a product page, results are automatically filtered to that product. Users can remove the filter to search all content.

Resources

  • Multi-product overview - Conceptual guide to multi-product documentation including product switching and organization strategies
  • Navigation elements - Configure navigation elements and structures for multi-product sites with product-specific navigation
 
Next page