Automatic Table of Content (TOC)

Block

This WordPress plugin creates a table of contents (TOC) from all headings in a post or page. The plugin provides a Gutenberg block, shortcode and a widget that can be used to display the TOC in different places on the website. The TOC is built by extracting headings from the post/page content, generating anchor links for each heading, and creating a nested list structure based on the heading levels.

Shortcode

Add the shortcode anywhere you want to display table of contents.

[toc]

Output:

Widget

Add the TOC widget anywhere you want to display table of contents.

Output:

Exclude Headings

To exclude headings from the TOC shortcode use the “exclude” attribute in the shortcode, for example:

[toc exclude="On this page, Comments"]

Output:

Styles

Currently the TOC can for now only be styled using custom CSS, like this:

/* Toc */
.toc{
	border-style:solid;
	z-index:99;
	position:fixed;
	background-color:#ffffff;
	transform:translatex(0px) translatey(0px);
	right:5%;
	top:20%;
	display:inline-block;
	
}

/* List */
.toc > ul, .toc > ul > ul{
	margin-left:0px;
	margin-bottom:0px;
}

/* List */
.toc > ul > ul > ul{
	margin-left:25px;
	margin-right:25px;
	margin-top:25px;
}

/* List */
.toc ul ul ul ul{
	margin-left:35px;
	margin-bottom:0px;
}

WPXSS.COM Blog: How to Add Custom CSS Code to WordPress

We are working on creating Themes that can easily be enabled with a few clicks.

FAQ

How to add TOC?

Add the toc shortcode or widget anywhere you want to display table of contents.

How this plugin works?

This WordPress plugin creates a table of contents (TOC) from all headings in a post or page. The plugin provides a shortcode and a widget that can be used to display the TOC in different places on the website.
The TOC is built by extracting headings from the post/page content, generating anchor links for each heading, and creating a nested list structure based on the heading levels.

How to exclude headings?

To exclude headings from the TOC shortcode use the “exclude” attribute in the shortcode, for example: exclude="On this page, Comments"

Can I include it in a (premium) theme?

Of course, nothing would make us more proud than being included in your next theme (free or premium)!
if you integrate our plugin in your theme or plan to do so, please just message us at Our Contact Page and we’ll be more than happy to feature your theme in this description and our official blog.

Download for Free the Automatic Table of Content WordPress Plugin

Version: 1.1 ⭐⭐⭐⭐⭐(0) Compatible with WordPress 6.1.7 Last update: February 6, 2023