The Table of Contents block creates a table of contents based on all the headings on a page. It gives your readers an overview of your content with links to navigate directly to each section. In this guide, you’ll learn how to add and customize the Table of Contents block.
To add the Table of Contents block to a page or post, follow these steps:
- Click the + block inserter and search for “table of contents.”
- Click the Table of Contents icon to add the block.
⚠️
If you’re missing the Table of Contents block, ensure the Gutenberg plugin is active on your site. If you deactivate the Gutenberg plugin, existing Table of Contents blocks will display a warning in the editor and appear as a basic list on the front end of your site.
For more information, visit our detailed instructions on adding blocks.
The Table of Contents block automatically creates links from all the Heading blocks on the page. It uses HTML anchors so that readers can click any item in the table of contents to jump directly to that section. If you prefer to choose which items to include, you can use the toolbar option to convert it to a list of static, editable links.
To add a heading that automatically appears in the Table of Contents, follow these steps:
- Click the + block inserter and add a Heading block.
- Set the heading level (H2–H6). Start with H2 since the page title uses H1.
- Enter your heading text.
As you add new headings, update existing ones, or reorder them, the Table of Contents block automatically updates to reflect the new sequence.
If you insert the Table of Contents block without any Heading blocks in your content, you’ll see a prompt to start adding headings.
Headings nested below a higher-level heading (for example, an H3 below an H2) appear as indented sub-items in the table of contents. Learn more about heading levels.
If you add a higher-level heading below a lower-level one (for example, an H2 below an H6), the higher-level heading won’t appear.
When you click on the block, a toolbar of options appears above or below it:
The Table of Contents block toolbar includes the following options, from left to right:
- Transform the block to another type.
- Drag the block to change its position.
- Move the block up or down.
- Convert the table of contents to a List block.
- More options.
When you select a block, you will find additional block settings in the right sidebar. If you do not see the sidebar, you may need to click the Settings icon in the top-right corner to bring up the settings. This icon looks like a square with two uneven columns:
On pages or posts that include pagination or page breaks, this setting lets you include headings from the current page only or from all pages.
By default, all six heading levels (H1 – H6) are included in the table of contents. You can use the “Include headings down to level” setting to only include headings up to and including the selected level.
For more, visit the detailed instructions on Advanced settings.
In the block settings sidebar, click on the Styles icon to access the design settings for the block. The Styles icon is in the shape of a circle, with half of the circle filled in:
The Table of Contents block includes the following settings to adjust the appearance of the text:
