Skip to content
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
87 changes: 41 additions & 46 deletions fern/products/docs/pages/navigation/products.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -113,58 +113,53 @@ products:
</Step>
<Step title="Add versioning to your products (optional)">

You can optionally add versions to a product. Versioned and unversioned products can live next to each other in your site. Each version of a single product has its own `yml` file.

In the below example, Product A is **unversioned** and Product B is **versioned**:

<CodeBlock>

```bash {8, 10-17}
fern/
├─ fern.config.json
├─ generators.yml
├─ docs.yml
├─ pages/
├─ ...
└─ products/
├── product-a.yml # basic unversioned product
└── product-b/ # versioned product
├─ product-b.yml
└─ versions/
├─ latest/
│ ├─ latest.yml
│ └─ pages/...
└─ v2/
├─ v2.yml
└─ pages/...
```
</CodeBlock>
You can add versions to your products by specifying the versions in your `docs.yml` configuration. Each version must have its own corresponding YAML file.

The top-level `doc.yml` configuration for a Fern Docs website containing two products, one unversioned and one versioned, might look something like this:
Here's how to structure your versioned product configuration:

<CodeBlock title="docs.yml">
```yaml {2, 8, 13-17}
```yaml
products:
- display-name: Product A # unversioned
path: ./products/product-a.yml
icon: fa-solid fa-leaf # optional
slug: product-a # optional
subtitle: Product A subtitle # optional

- display-name: Product B # versioned
path: ./products/product-b/latest.yml # <-- default showing latest
image: ./images/product-b.png # optional
slug: product-b # optional
subtitle: Product B subtitle # optional
versions: # optional
- display-name: Latest
path: ./products/product-b/latest.yml
- display-name: V2
path: ./products/product-b/v2.yml
- display-name: Data API
path: ./products/data/versions/v2.yml # default version path
subtitle: Integrate with your API
icon: fa-light fa-database
slug: data
versions:
- display-name: v2
slug: v2.0.0
path: ./products/data/versions/v2.yml
- display-name: v2 (beta)
slug: v2.0.0-beta
path: ./products/data/versions/v2-beta.yml
- display-name: v1 (legacy)
slug: v1.0.0
path: ./products/data/versions/v1.yml
```
</CodeBlock>

For more information on setting up versioned products, follow our [versioning docs](/docs/navigation/versions).
Each version requires:
- `display-name`: The version name shown in the UI
- `path`: Path to the version's YAML configuration file
- `slug`: URL-friendly identifier for the version (optional)

Your file structure for a versioned product might look like this:

```bash
fern/
└─ products/
└─ data/
└─ versions/
├─ v2.yml
├─ v2-beta.yml
└─ v1.yml
```

<Note>
Products can be mixed between versioned and unversioned in the same documentation site. You only need to add the `versions` configuration to products that require versioning.
</Note>

For more detailed information on versioning, see our [versioning documentation](/docs/navigation/versions).
</Step>
<Step title="Remove extra navigation from docs.yml">

Expand Down Expand Up @@ -234,4 +229,4 @@ The dropdown menus for product and version selectors can be customized using the
<img src="webflow-version-selector.avif" alt="Example of a styled version selector" />
</Frame>
</Tab>
</Tabs>
</Tabs>