diff --git a/fern/products/docs/docs.yml b/fern/products/docs/docs.yml
index bf5f1f302..1978deb4b 100644
--- a/fern/products/docs/docs.yml
+++ b/fern/products/docs/docs.yml
@@ -247,33 +247,42 @@ navigation:
- section: API References
collapsed: true
contents:
- - page: Generate REST API Reference
- path: ./pages/api-references/generate-api-ref.mdx
- slug: generate-api-ref
- - page: SDK snippets
- path: ./pages/api-references/sdk-snippets.mdx
- - page: HTTP snippets
- path: ./pages/api-references/http-snippets.mdx
- - page: API Explorer
- path: ./pages/api-references/api-explorer.mdx
- slug: api-explorer
- - page: Audiences
- path: ./pages/api-references/audiences.mdx
- - page: Customize API Reference layout
- path: ./pages/api-references/customize-api-ref.mdx
- - page: Write Markdown in API Reference
- path: ./pages/api-references/api-ref-content.mdx
- - page: Generate Webhook Reference
- path: ./pages/api-references/generate-webhook-ref.mdx
- - page: Generate WebSocket Reference
- path: ./pages/api-references/generate-websocket-ref.mdx
- slug: generate-websocket-ref
- - page: Generate OpenRPC Reference
- path: ./pages/api-references/generate-openrpc-ref.mdx
- slug: generate-openrpc-ref
- - page: Generate GraphQL Reference
- path: ./pages/api-references/generate-graphql-ref.mdx
- slug: generate-graphql-ref
+ - section: Generation
+ skip-slug: true
+ contents:
+ - page: REST API Reference
+ path: ./pages/api-references/generate-api-ref.mdx
+ slug: generate-api-ref
+ - page: Webhook Reference
+ path: ./pages/api-references/generate-webhook-ref.mdx
+ - page: WebSocket Reference
+ path: ./pages/api-references/generate-websocket-ref.mdx
+ slug: generate-websocket-ref
+ - page: OpenRPC Reference
+ path: ./pages/api-references/generate-openrpc-ref.mdx
+ slug: generate-openrpc-ref
+ - page: GraphQL Reference
+ path: ./pages/api-references/generate-graphql-ref.mdx
+ slug: generate-graphql-ref
+ - section: Customization
+ skip-slug: true
+ contents:
+ - page: Customize API Reference layout
+ path: ./pages/api-references/customize-api-ref.mdx
+ - page: Audiences
+ path: ./pages/api-references/audiences.mdx
+ - page: Write Markdown in API Reference
+ path: ./pages/api-references/api-ref-content.mdx
+ - section: Code exploration
+ skip-slug: true
+ contents:
+ - page: SDK snippets
+ path: ./pages/api-references/sdk-snippets.mdx
+ - page: HTTP snippets
+ path: ./pages/api-references/http-snippets.mdx
+ - page: API Explorer
+ path: ./pages/api-references/api-explorer.mdx
+ slug: api-explorer
- section: SEO & GEO
slug: seo
collapsed: true
diff --git a/fern/products/docs/pages/api-references/customize-api-ref.mdx b/fern/products/docs/pages/api-references/customize-api-ref.mdx
index 0b6171e27..7adff7a44 100644
--- a/fern/products/docs/pages/api-references/customize-api-ref.mdx
+++ b/fern/products/docs/pages/api-references/customize-api-ref.mdx
@@ -96,28 +96,15 @@ The `layout` option allows you to specify the order of sub-packages, sections, e
```
- You can reference an operation using the format `operation: OPERATION_TYPE operationName`. See [GraphQL layout customization](/learn/docs/api-references/generate-graphql-ref#customize-the-layout) for more details.
+ Reference individual GraphQL operations using the `operation` keyword with the format `OPERATION_TYPE operationName`, where `OPERATION_TYPE` is `QUERY`, `MUTATION`, or `SUBSCRIPTION`. If your schema includes operations that share the same name across different namespaces, use dot notation to disambiguate.
```yaml title="docs.yml"
navigation:
- api: API Reference
layout:
- user:
- - operation: QUERY getUser
- - operation: MUTATION createUser
- - operation: MUTATION deleteUser
- ```
-
-
- You can reference a WebSocket endpoint using the format `WSS /path/name`.
- ```yaml title="docs.yml"
- navigation:
- - api: API Reference
- layout:
- - plants:
- - GET /plants
- - WSS /plants/live-updates
- - WSS /plants/growth-monitor
- ```
+ - operation: QUERY admin.getUser
+ - operation: MUTATION createPlant
+ - operation: SUBSCRIPTION plantUpdates
@@ -132,24 +119,57 @@ The `layout` option allows you to specify the order of sub-packages, sections, e
By default, section display names come from [service file names](/api-definitions/ferndef/endpoints/overview#service-definition) (Fern
Definition) or tag names (OpenAPI) in your spec.
-To override the display name of a section, use the `section` property in your `docs.yml` and reference the `lowerCamelCase` version of the original service file name (Fern Definition) or tag name (OpenAPI) in `referenced-packages`.
+To override the display name of a section, use the `section` property in your `docs.yml`.
-```yaml title="docs.yml" {4-6}
-navigation:
- - api: API Reference
- layout:
- - section: "Billing" # New section display name
- referenced-packages:
- - billing # lowerCamelCase version of original tag/service file name from your spec
- contents: []
- - section: "Bank Accounts"
- referenced-packages:
- - bankAccounts
- contents: []
-```
-
- For OpenAPI, you can alternatively customize tag display names directly in your spec (or `overrides.yml` file) using the [`x-displayName` extension](/api-definitions/openapi/extensions/tag-display-names).
-
+
+
+ ```yaml title="docs.yml" {4-6}
+ navigation:
+ - api: API Reference
+ layout:
+ - section: "Billing" # New section display name
+ referenced-packages:
+ - billing # lowerCamelCase version of original tag name from your spec
+ contents: []
+ - section: "Bank Accounts"
+ referenced-packages:
+ - bankAccounts
+ contents: []
+ ```
+
+ You can alternatively customize tag display names directly in your spec (or overlays file) using the [`x-displayName` extension](/api-definitions/openapi/extensions/tag-display-names).
+
+
+
+ ```yaml title="docs.yml" {4-6}
+ navigation:
+ - api: API Reference
+ layout:
+ - section: "Billing" # New section display name
+ referenced-packages:
+ - billing # lowerCamelCase version of original service file name from your spec
+ contents: []
+ - section: "Bank Accounts"
+ referenced-packages:
+ - bankAccounts
+ contents: []
+ ```
+
+
+ ```yaml title="docs.yml"
+ navigation:
+ - api: GraphQL API Reference
+ layout:
+ - section: Plants
+ contents:
+ - operation: QUERY getPlant
+ - operation: MUTATION createPlant
+ - section: Real-time
+ contents:
+ - operation: SUBSCRIPTION plantUpdates
+ ```
+
+
### Flattening sections
@@ -205,6 +225,17 @@ To customize the display of an endpoint, you can add a `title`. You can also use
slug: live-updates
```
+
+ ```yaml title="docs.yml" {6-8}
+ navigation:
+ - api: API Reference
+ layout:
+ - user:
+ - operation: QUERY getUser
+ title: Get user details
+ slug: get-user
+ ```
+
@@ -252,6 +283,15 @@ You can hide an endpoint from the API Reference by setting `hidden` to `true`. T
hidden: true
```
+
+ ```yaml title="docs.yml" {5}
+ navigation:
+ - api: API Reference
+ layout:
+ - operation: MUTATION deletePlant
+ hidden: true
+ ```
+
### Adding custom sections
@@ -274,16 +314,30 @@ You can add arbitrary folders in the sidebar by adding a `section` to your API R
```yaml title="docs.yml"
- navigation:
+ navigation:
- api: API Reference
- layout:
+ layout:
- section: My Section
icon: flower
- contents:
+ contents:
- user.update
- plant
```
+
+ ```yaml title="docs.yml"
+ navigation:
+ - api: API Reference
+ layout:
+ - section: Plants
+ contents:
+ - operation: QUERY getPlant
+ - operation: MUTATION createPlant
+ - section: Real-time
+ contents:
+ - operation: SUBSCRIPTION plantUpdates
+ ```
+
@@ -360,7 +414,19 @@ navigation:
When you set availability for a section, all endpoints in that section will inherit the section-level availability unless explicitly overridden in your API definition.
-You can't set availability for individual endpoints in `docs.yml`. Endpoint availability must be configured directly in your API definition. Learn more about availability for [OpenAPI](/learn/api-definitions/openapi/extensions/availability) or [Fern Definition](/learn/api-definitions/ferndef/availability).
+
+ You can't set availability for individual OpenAPI and Fern Definition endpoints in `docs.yml` — endpoint availability must be configured directly in your API definition. Learn more about availability for [OpenAPI](/learn/api-definitions/openapi/extensions/availability) or [Fern Definition](/learn/api-definitions/ferndef/availability).
+
+ For GraphQL, `availability` can be set per operation:
+
+ ```yaml title="docs.yml"
+ navigation:
+ - api: API Reference
+ layout:
+ - operation: SUBSCRIPTION plantUpdates
+ availability: beta
+ ```
+
### Displaying endpoint errors
diff --git a/fern/products/docs/pages/api-references/generate-api-ref.mdx b/fern/products/docs/pages/api-references/generate-api-ref.mdx
index f3fcc4ee4..1ad0a51e0 100644
--- a/fern/products/docs/pages/api-references/generate-api-ref.mdx
+++ b/fern/products/docs/pages/api-references/generate-api-ref.mdx
@@ -6,7 +6,7 @@ description: Use Fern Docs to generate REST API Reference documentation from an
Fern generates REST API Reference documentation from an [OpenAPI specification](/learn/api-definition/openapi/overview) or [Fern Definition](/learn/api-definition/fern/overview). Once the API definition is set up, adding it to the docs takes just one line of configuration.
- Fern also supports [GraphQL](/learn/docs/api-references/generate-graphql-ref), [WebSocket](/learn/docs/api-references/generate-websocket-ref) (AsyncAPI or Fern Definition), [OpenRPC](/learn/docs/api-references/generate-openrpc-ref), and [Webhook](/learn/docs/api-references/generate-webhook-reference) references.
+ Fern also supports [GraphQL](/learn/docs/api-references/generate-graphql-ref), [WebSocket](/learn/docs/api-references/generate-websocket-ref) (AsyncAPI or Fern Definition), [OpenRPC](/learn/docs/api-references/generate-openrpc-ref), and [Webhook](/learn/docs/api-references/generate-webhook-ref) references.
## Configuration
@@ -37,28 +37,37 @@ navigation:
Fern will automatically populate your endpoints, types, and code snippets from your API definition. Request and response examples are [generated using AI](/learn/docs/ai-features/ai-examples) to show realistic data instead of placeholder values.
-
+
For a full list of configuration options and layout customizations, see [Customize API Reference layout](/learn/docs/api-references/customize-api-reference-layout).
+
+
+
### Include more than one API Reference
To include multiple, distinct API definitions in your documentation, use the `api-name` property. The `api-name` corresponds to the folder name containing your API definition.
This works with any combination of OpenAPI and Fern Definition formats. For example:
-```bash
-fern/
- ├─ fern.config.json
- ├─ docs.yml
- ├─ plant-api/
- │ ├─ openapi.yml # OpenAPI spec
- │ └─ generators.yml # References the OpenAPI spec
- └─ garden-api/
- └─ definition/ # Fern Definition (auto-detected)
- └─ api.yml
-```
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
For a simple setup without tabs, you can include multiple API References directly in your navigation:
```yaml title="docs.yml"
@@ -68,7 +77,8 @@ navigation:
- api: Garden
api-name: garden-api # Matches folder name containing your API definition
```
-
+
+
When using tabs, each API Reference must be placed within a tab's `layout`:
```yaml title="docs.yml" {12, 17}
@@ -91,3 +101,5 @@ navigation:
api-name: garden-api # Matches folder name containing your API definition
skip-slug: true
```
+
+
\ No newline at end of file
diff --git a/fern/products/docs/pages/api-references/generate-graphql-ref.mdx b/fern/products/docs/pages/api-references/generate-graphql-ref.mdx
index 79d72c077..e98754f4f 100644
--- a/fern/products/docs/pages/api-references/generate-graphql-ref.mdx
+++ b/fern/products/docs/pages/api-references/generate-graphql-ref.mdx
@@ -1,128 +1,80 @@
---
-title: Generate GraphQL reference
-description: Learn how to generate and customize GraphQL API Reference documentation
+title: Generate GraphQL Reference
+description: Use Fern Docs to generate GraphQL API Reference documentation from a GraphQL schema.
---
Fern generates API Reference documentation from a [GraphQL schema](https://graphql.org/learn/schema/). Add your schema file to your Fern project and Fern renders queries, mutations, subscriptions, and types as an interactive reference.
-## How to add a GraphQL endpoint
+## Configuration
-1. Add your GraphQL schema files to your `/fern` directory.
-2. Configure your `generators.yml` to point to your GraphQL schemas:
+
+
-
- ```yaml
- api:
- specs:
- - graphql: plants.schema.graphql
- name: Plants
- origin: https://api.example.com/plants/graphql
- - graphql: storefront.schema.graphql
- name: Storefront
- origin: https://api.example.com/storefront/graphql
- ```
-
+Add your GraphQL schema file to your `/fern` directory and create a `generators.yml` that references it:
-3. Reference the API in your `docs.yml` navigation:
+```yaml generators.yml
+api:
+ specs:
+ - graphql: plants.schema.graphql
+ name: Plants
+ origin: https://api.example.com/plants/graphql
+```
+
+
+
-```yaml docs.yml
+Add `- api: API Reference` to your navigation in `docs.yml`:
+
+```yml docs.yml
navigation:
- api: API Reference
```
-### Configuration properties
+
+
-
- Path to your GraphQL schema file. You can include multiple GraphQL specs if your project exposes more than one GraphQL API.
-
+For a full list of configuration options and layout customizations, see [Customize API Reference layout](/learn/docs/api-references/customize-api-reference-layout).
-
- Name of the folder that operations from this spec appear under in the API Reference sidebar. Use this to group related GraphQL operations together.
-
+
+
-
- URL of your GraphQL API endpoint. Fern performs [introspection](https://graphql.org/learn/introspection/) against this endpoint to fetch the schema. When set, [running `fern api update`](/learn/cli-api-reference/cli-reference/commands#fern-api-update) updates the local schema from this endpoint.
-
+### Include more than one GraphQL Reference
-### Include more than one GraphQL reference
-
-To include multiple GraphQL definitions in your documentation, use the `api-name` property:
-
-```yaml title="docs.yml"
-navigation:
- - api: Plant GraphQL API
- api-name: plant-graphql
- - api: Garden GraphQL API
- api-name: garden-graphql
-```
-
-Organize each schema in a separate directory within your Fern project:
+To include multiple GraphQL definitions in your documentation, use the `api-name` property. The `api-name` corresponds to the folder name containing your GraphQL schema.
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
-## Customize the layout
-
-Use the `layout` property in `docs.yml` to control how GraphQL operations appear in the sidebar. Reference individual operations with the `operation` keyword using the format `OPERATION_TYPE operationName`, where `OPERATION_TYPE` is `QUERY`, `MUTATION`, or `SUBSCRIPTION`.
-
-You can also set a custom `title`, `slug`, `hidden`, or `availability` on each operation:
-
```yaml title="docs.yml"
navigation:
- - api: GraphQL API Reference
- layout:
- - operation: QUERY getPlant
- title: Get plant details
- slug: get-plant
- - operation: MUTATION createPlant
- title: Create a plant
- - operation: MUTATION deletePlant
- hidden: true
- - operation: SUBSCRIPTION plantUpdates
- availability: beta
-```
-
-### Group operations into sections
-
-Organize operations under custom sections:
-
-```yaml title="docs.yml"
-navigation:
- - api: GraphQL API Reference
- layout:
- - section: Plants
- contents:
- - operation: QUERY getPlant
- - operation: MUTATION createPlant
- - section: Real-time
- contents:
- - operation: SUBSCRIPTION plantUpdates
+ - api: Plant GraphQL API
+ api-name: plant-graphql
+ - api: Garden GraphQL API
+ api-name: garden-graphql
```
-### Namespaced operations
+### Configuration properties
-If your schema includes operations that share the same name across different namespaces, use dot notation to disambiguate:
+
+ Path to your GraphQL schema file. You can include multiple GraphQL specs if your project exposes more than one GraphQL API.
+
-```yaml title="docs.yml"
-navigation:
- - api: GraphQL API Reference
- layout:
- - operation: QUERY admin.getPlant
- - operation: QUERY public.getPlant
-```
+
+ Name of the folder that operations from this spec appear under in the API Reference sidebar. Use this to group related GraphQL operations together.
+
-
-For the full set of layout options that apply to all API types (alphabetizing, flattening, adding pages and links, and more), see [Customize API Reference layout](/learn/docs/api-references/customize-api-reference-layout).
-
+
+ URL of your GraphQL API endpoint. Fern performs [introspection](https://graphql.org/learn/introspection/) against this endpoint to fetch the schema. When set, [running `fern api update`](/learn/cli-api-reference/cli-reference/commands#fern-api-update) updates the local schema from this endpoint.
+
diff --git a/fern/products/docs/pages/api-references/generate-openrpc-ref.mdx b/fern/products/docs/pages/api-references/generate-openrpc-ref.mdx
index 903b451c3..5080cf932 100644
--- a/fern/products/docs/pages/api-references/generate-openrpc-ref.mdx
+++ b/fern/products/docs/pages/api-references/generate-openrpc-ref.mdx
@@ -9,21 +9,66 @@ Fern generates OpenRPC Reference documentation from an [OpenRPC](https://open-rp
-## How to add an OpenRPC endpoint
+## Configuration
-1. Add your OpenRPC specification file (e.g., `openrpc.yaml`) to your `/fern` directory.
-2. Configure your `generators.yml` to point to your OpenRPC spec:
+
+
-
- ```yaml
- api:
- specs:
- - openrpc: ../../api-specs/openrpc/wallet.yml
- ```
-
+Add your OpenRPC specification file (e.g., `openrpc.yaml`) to your `/fern` directory and create a `generators.yml` that references it:
+
+```yaml generators.yml
+api:
+ specs:
+ - openrpc: ./openrpc.yml
+```
+
+
+
+
+Add `- api: API Reference` to your navigation in `docs.yml`:
+
+```yml docs.yml
+navigation:
+ - api: API Reference
+```
+
+
+
+
+For a full list of configuration options and layout customizations, see [Customize API Reference layout](/learn/docs/api-references/customize-api-reference-layout).
+
+
+
+
+### Include more than one OpenRPC Reference
+
+To include multiple OpenRPC definitions in your documentation, use the `api-name` property. The `api-name` corresponds to the folder name containing your OpenRPC definition.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```yaml title="docs.yml"
+navigation:
+ - api: Wallet API
+ api-name: wallet-api
+ - api: NFT API
+ api-name: nft-api
+```
### Configuration properties
Path to your OpenRPC specification file. You can include multiple OpenRPC specs if your project exposes more than one JSON-RPC API.
-
\ No newline at end of file
+
diff --git a/fern/products/docs/pages/api-references/generate-webhook-ref.mdx b/fern/products/docs/pages/api-references/generate-webhook-ref.mdx
index 59a6f19ec..63c17be2e 100644
--- a/fern/products/docs/pages/api-references/generate-webhook-ref.mdx
+++ b/fern/products/docs/pages/api-references/generate-webhook-ref.mdx
@@ -3,85 +3,73 @@ title: Generate Webhook Reference
description: Use Fern Docs to generate your Webhook Reference documentation from an OpenAPI spec or Fern Definition.
---
-Fern generates Webhook Reference documentation from an [OpenAPI specification](../../openapi-definition/endpoints/webhooks) or [Fern Definition](../../fern-definition/webhooks).
+Fern generates Webhook Reference documentation from an [OpenAPI specification](/learn/api-definitions/openapi/endpoints/webhooks) or [Fern Definition](/learn/api-definitions/ferndef/webhooks).
Fern supports webhooks through:
- **OpenAPI 3.1+**: Use the native `webhooks` field with an `operationId` (recommended)
- **OpenAPI 3.0**: Use the `x-fern-webhook: true` extension
- **Fern Definition**: Define `webhooks` in your specification
-## Configure your webhook reference
+## Configuration
-Add a page title (`api`) and reference the name of the directory where your where your webhook definition is located (`api-name`).
+
+
-```yml docs.yml {11-12}
+For **OpenAPI**: Add your specification file to your `/fern` directory and create a `generators.yml` that references it:
+
+```yaml generators.yml
+api:
+ path: openapi/openapi.yml
+```
+
+For **Fern Definition**: Add a `definition/` directory with your webhook definition files (Fern auto-detects this).
+
+
+
+
+Add `- api: Webhook Reference` to your navigation in `docs.yml`:
+
+```yml docs.yml
navigation:
- - section: Introduction
- contents:
- - page: Getting Started
- path: ../introduction/getting-started.md
- - page: Authentication
- path: ../introduction/authentication.md
- - api: API Reference
- api-name: api-v1
- display-errors: true
- api: Webhook Reference
api-name: webhooks-v1
```
-For a real-world example of webhook documentation generated from an API definition, check out [Webflow's webhooks](https://developers.webflow.com/data/reference/webhooks/events/form-submission).
+Use the `api-name` property to reference the folder containing your webhook definition.
-### Directory structure
-Your webhooks should be defined in a dedicated folder within your Fern project:
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+For a full list of configuration options and layout customizations, see [Customize API Reference layout](/learn/docs/api-references/customize-api-reference-layout).
-If you're using OpenAPI, your `generators.yml` file should point to your OpenAPI specification:
+
+
-```yml generators.yml
-api:
- path: openapi/openapi.yml
-```
+For a real-world example of webhook documentation generated from an API definition, check out [Webflow's webhooks](https://developers.webflow.com/data/reference/webhooks/events/form-submission).
+
+### Include more than one Webhook Reference
+
+To include multiple webhook definitions in your documentation, use the `api-name` property. The `api-name` corresponds to the folder name containing your webhook definition.
-You can read more about how to define webhooks in your OpenAPI specification [here](/learn/api-definitions/openapi/endpoints/webhooks).
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
-
+
-You can read more about how to define webhooks in your Fern Definition [here](/learn/api-definition/fern/webhooks).
-
-
-
-### Include more than one webhook reference
-To include multiple webhook definitions in your documentation, use the `api-name` property:
-
```yaml title="docs.yml"
navigation:
- api: Payment Webhooks
@@ -90,55 +78,36 @@ navigation:
api-name: order-webhooks
```
-When using multiple webhook definitions, organize them in separate directories within your Fern project:
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-### Create individual documentation pages for each webhook event
+### Reference individual webhook events
-To display each webhook event as an individual page with rich examples:
+To display each webhook event as an individual page, reference it in the `layout` using the `subpackage_{tag}.{webhook-event-name}` format:
-Reference individual webhook pages using the `subpackage_{tag}.{webhook-event-name}` format, where:
-- `{tag}` is the first tag (lowercase) from your webhook definition
-- `{webhook-event-name}` is the `operationId` from your webhook definition
-
```yaml title="docs.yml"
navigation:
- - subpackage_plants.newPlantWebhook
+ - api: Webhook Reference
+ api-name: webhooks-v1
+ layout:
+ - subpackage_plants.newPlantWebhook
```
+Where `{tag}` is the first tag (lowercase) and `{webhook-event-name}` is the `operationId` from your webhook definition.
+
- For OpenAPI, you must have the `tags` and `example` properties defined [in your webhook specification](/api-definitions/openapi/endpoints/webhooks).
+ For OpenAPI, you must have the `tags` and `example` properties defined [in your webhook specification](/learn/api-definitions/openapi/endpoints/webhooks).
-Reference the individual webhook event using the `subpackage_{name}.{webhook-event-name}` format, where:
-- `{name}` is the name of your API as defined in the `api.yml` file for your webhook definition.
-- `{webhook-event-name}` is the identifier from your webhook definition
-
```yaml title="docs.yml"
navigation:
- - subpackage_api.newPlantWebhook
+ - api: Webhook Reference
+ api-name: webhooks-v1
+ layout:
+ - subpackage_api.newPlantWebhook
```
+
+Where `{name}` is the name of your API as defined in `api.yml` and `{webhook-event-name}` is the identifier from your webhook definition.
diff --git a/fern/products/docs/pages/api-references/generate-websocket-ref.mdx b/fern/products/docs/pages/api-references/generate-websocket-ref.mdx
index 2283c4732..a24e0a1a1 100644
--- a/fern/products/docs/pages/api-references/generate-websocket-ref.mdx
+++ b/fern/products/docs/pages/api-references/generate-websocket-ref.mdx
@@ -13,33 +13,60 @@ Fern generates WebSocket Reference documentation from an [AsyncAPI specification
## Configuration
-1. For both Fern Definition and AsyncAPI, add your WebSocket specification file to your `/fern` directory.
-
-2. For AsyncAPI only, reference the file in `generators.yml`:
-
-
- ```yaml
- api:
- path: asyncapi.yml # Location of spec (required)
- origin: https://github.com/your-org/your-repo/blob/main/asyncapi.yml # Fetch from remote URL (optional)
- ```
-
-
- Fern Definition WebSocket files are auto-discovered (no additional configuration required).
-
-### Customize layout
-
-You can customize the WebSocket endpoint display with `title` and `slug` properties, similar to REST endpoints. For more details, see [Customize API Reference layout](/learn/docs/api-references/customize-api-reference-layout).
-
- ```yaml title="docs.yml" {9-10}
- navigation:
- - api: API Reference
- layout:
- - user:
- - endpoint: user.create
- title: Create a User
- slug: user-creation
- - user.delete
- - endpoint: WSS /v1/realtime
- title: Realtime
- ```
+
+
+
+For **AsyncAPI**: Add your specification file to your `/fern` directory and create a `generators.yml` that references it:
+
+```yaml generators.yml
+api:
+ path: asyncapi.yml
+ origin: https://github.com/your-org/your-repo/blob/main/asyncapi.yml # optional
+```
+
+For **Fern Definition**: Add your WebSocket definition files to a `definition/` directory (Fern auto-detects this).
+
+
+
+
+Add `- api: API Reference` to your navigation in `docs.yml`:
+
+```yml docs.yml
+navigation:
+ - api: API Reference
+```
+
+
+
+
+For a full list of configuration options and layout customizations, see [Customize API Reference layout](/learn/docs/api-references/customize-api-reference-layout).
+
+
+
+
+### Include more than one WebSocket Reference
+
+To include multiple WebSocket definitions in your documentation, use the `api-name` property. The `api-name` corresponds to the folder name containing your WebSocket definition.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```yaml title="docs.yml"
+navigation:
+ - api: Streaming API
+ api-name: streaming-api
+ - api: Realtime API
+ api-name: realtime-api
+```