The Table of Contents Plugin is designed to help you add tables of contents to posts, pages and sidebars.

Once you’ve activated the Table of Contents plugin in Plugins > All it automatically adds a table of content before the first heading on any page with four or more headings.

Here’s an example of the default table of contents on a page.

Extensive options for controlling the display position, minimum number of headings before the table of content is displayed, appearance and more can be customized in Settings > TOC+.

Add Headings

Headings are used to break up posts and pages into manageable bite size chunks. How you add a heading depends on if you are using the block editor or the classic editor.

Block Editor

The following section explains how to add a heading using the block editor. If you are using the classic editor, refer to the classic editor section.

Place your cursor in your post/page where you want to add your heading and add a Heading block.

add heading block

Once you have added the heading block you type the text you want to appear in your heading.

Add your heading text

The default heading style is Heading 2 and can be changed to Heading 3 or 4 by clicking on the H2 icon in the block toolbar and selecting the preferred heading style.

Changing heading styles

Classic Editor

The following section explains how to add a heading using the classic editor. If you are using the block editor, refer to the block editor section.

1.  Highlight the text you want to change into a heading.

2.  Select the Heading Style you want to apply from the Styles drop down menu.

3.  Preview your post/page to make sure that headings have broken your post into manageable chunks.

Heading styles

TOC+ Settings page

The TOC+ Settings page is where you configure and customize your table of contents.

Once you have activated the Table of Contents plugin you can configure it as follows:

1.  Go to Settings > TOC+

Table of contents setting

2.  Select where you want the table of contents to appear.

Select position
  • Before first heading (default): the table of content appears just above the first heading on the post or page.
  • Top: the table of content appears at the top of the content just below the post (page) title.
  • Bottom: the table of content appears at the bottom of the content.

3.  Select the minimum number of headings before a table of content appears.

By default, you must have four or more headings before a table of contents is added.

Select number of headings

4.  Select the content types you want table of contents to be automatically inserted into.

By default, the table of contents is added to pages only.

Select content type

5.  Customize how the table of content displays.

Heading Text

6.  Customize the appearance of your table of contents.

Appearance
  • Width: allows you to set the width of your table of content.
  • Wrapping: controls if your table of content is left aligned or right aligned with text wrapped or has no text wrapping.
  • Font size: controls the size of the font in the table of content.
  • Presentation: allows you to change the appearance of your table of content.

TOC Shortcodes

The TOC Shortcodes allow you to fully control the appearance of table of contents.

You use the [toc] shortcode if you only want the Table of contents to appear in specific posts or pages; or want greater control of the position of your table of contents.

You can use the following attributes with the [toc] shortcode:

  • label: text, title of the table of contents
  • no_label: true/false, shows or hides the title
  • wrapping: text, either “left” or “right”
  • heading_levels: numbers, this lets you select the heading levels you want included in the table of contents. Separate multiple levels with a comma. Example: include headings 3, 4 and 5 but exclude the others with heading_levels=”3,4,5″

For example, I would use the following shortcode if I wanted to display a right aligned, text wrapped table of contents.

Adding shortcode to control look of Table of contents

Here is what it looks like aligned right.

Aligned right table of contents

The [no_toc] shortcode allows you to disable the table of contents for the current post or page.

TOC+ Widget

The TOC+ Widget allows you to display your tables of contents in the sidebar rather than your post or page.

1.  Go to Appearance > Widget in your Dashboard.

Widgets

2.  Drag the TOC+ widget from the Available Widgets into the desired Sidebar.

Add the TOC widget