Page table of contents
Add a table of contents (TOC) automatically to any markdown page.
You'll notice it on this page on the right-side of the page.
This page will explain:
- How the content is sourced for the TOC
- How to enable or disable the TOC globally
- How to override any setting for any specific page(s)
Global TOC setting
Enable the TOC on all pages by adding this to the siteConfig.yaml
file:
enableToc: true
The TOC is disabled by default. If you want to disable it explicitly, add this to the siteConfig.yaml
:
enableToc: false
TOC maximum depth
You may also control the maximum depth of the TOC.
This means if it will render h1
, h2
, h3
, h4
, h5
, h6
, etc...
Set it using a numeric value corresponding to the header level.
The developer portal defaults to a tocMaxDepth
of 4
, meaning it will render h1
, h2
, h3
, and h4
tags (except for the initial h1
).
tocMaxDepth: 3
It may be adjusted within the siteConfig.yaml
or in the front matter of any page.
Local TOC overrides
You may override the global setting in the front matter of a markdown-based page:
---
enableToc: false
---
---
enableToc: true
---
You may augment other front matter, by adding a new line.
---
title: Markdown example
description: GitHub-Flavored Markdown example
enableToc: true
---
TOC Content Source
The content of the TOC is sourced from the h2
, h3
, and h4
tags on the page.
It is also sourced from any additional h1
tags excluding an opening h1
tag.
A second h1 example
An h2 example
An h3 example
The h3
content will appear indented.
And an h4 example
The h4
content will appear further indented.
And an h5 too
The h5
content will not appear in the page table of contents.