navigation
Control the Previous and Next navigation buttons on project pages.
The navigation option also supports page-level configuration using front matter.
Options
| Option | Type | Description |
|---|---|---|
| nextButton | PageLink object | Controls the next page button. |
| previousButton | PageLink object | Controls the previous page button. |
PageLink object
| Option | Type | Description |
|---|---|---|
| hide | boolean | Specifies if the navigation link button is hidden. Default false. |
| text | string | Text that appears above the navigation buttons. Default value: Next page or Previous page respectively. |
Options that apply to front matter only
| Option | Type | Description |
|---|---|---|
| label | string | Text that appears on the button. The default value is the text of the first heading of the target page. |
| page | string | Path to a Markdown page in the project, or an URL. |
Examples
Change navigation buttons text globally
The following example changes text labels of the navigation buttons to Next chapter and Previous chapter respectively. This configuration applies to all pages in the project.
redocly.yaml
navigation:
nextButton:
text: "Next chapter"
previousButton:
text: "Previous chapterHide navigation links globally
The following example hides the navigation buttons on all pages of the project.
redocly.yaml
navigation:
nextButton:
hide: true
previousButton:
hide: trueCustomize navigation buttons in the front matter
The following example creates a custom reading flow. Instead of following the order of pages in the sidebar, navigation buttons direct the user to a page in a different section of the project.
---
navigation:
nextButton:
page: ../advanced-topics.md
text: "Next chapter"
label: Advanced concepts
previousButton:
page: ./docs/basics.md
text: "Previous chapter"
label: About basics
---Resources
- Use front matter to configure navigation button options on individual pages.
- Explore other configuration options for your project.