How to Add Table of Contents In WordPress (With/out A Plugin)

Having a table of contents in your WordPress posts/pages makes it easy to navigate and gives users an option to jump to their point of interest.

It also helps you to get more clicks from Google search results as Google shows a table of contents links in the SERPs.

So if you are not using the table of contents on your WordPress posts and pages, you should start using a table of contents for your long content.

Like everything, you can do it by using a WordPress plugin. You can also do it without using a plugin. I’ll show you both ways.

Now let’s dive into the details.

Adding Table Of Contents Without Using A Plugin

You can add a table of contents to your WordPress post/page without using a plugin.

WordPress Block Editor (Gutenberg) makes it extremely easy. You don’t need to have any coding skills to add a table of contents.

Just follow these simple steps.

Step 1: Make A List Of The Contents

Just examine your page and make a note of the key sections on it. Chances are you already have headings for your content.

Once done, make a list of them at the beginning of the page. It may be numbered, bulleted, or plain – whatever fits best.

The entries on the list give your visitor a gist of the content, so make sure you write captivating and crisp titles and keep the naming scheme for the table and the actual headings consistent.

Step 2: Highlight The Contents As Header & Add HTML Anchor

Now make sure that the subtitle you’re going to add to the table of contents is tagged as a heading. Then add the HTML anchor.

To add an anchor –

  • Select the heading and navigate to the ‘Block’ sidebar on the right.
  • Click on advanced, and you find the ‘HTML Anchor’ box.
  • Name your anchor the same as your heading to keep things consistent.

Now create anchors for other headings as well.

Step 3: Assign Anchors To The Table Of Contents

Now go back to the list you’ve created in Step 1. Highlight the first entry and click on the ‘Link’ icon from the toolbar. Then enter the # symbol followed by the name given in the HTML Anchor.

Do the same things for other lists. And that’s it. You now have a Table of Contents.

Adding Table Of Contents Using A Plugin

There are several WordPress plugins that let you add the table of contents to your WordPress posts/pages. Here I’ll be using the Ultimate Blocks plugin. It’s a Gutenberg Blocks plugin that offers a Table of Contents block.

Whenever you insert the ‘Table of Contents’ block, it will automatically generate the table of contents from headings. Let’s see how to add a table of contents using Ultimate Blocks.

Step 1: Install the Ultimate Blocks Plugin

Ultimate Blocks is a free plugin that is available on WordPress.org. You can install the plugin directly from your WordPress dashboard.

Just go to WordPress Admin Panel > Plugins > Add New and search for ‘Ultimate Blocks’. The very first result will be the Ultimate Blocks plugin. Then click on the ‘Install’ button and activate the plugin.

You can also download the plugin from here and upload it to your WordPress site.

Step 2: Insert ‘Table of Contents’ Block

Now go to the WordPress post or page where you want to add the table of contents.

Just type / followed by ‘table…’ and you will see the ‘Table of Contents’ block. Just click on it.

An automatically generated ToC will appear. It is entirely dynamic and updates itself with every change you make, leaving you free from the hassle of editing your ToC along the way.

Step 3: Configure Your Table of Contents

It isn’t a necessary step, but know that Ultimate Blocks gives you the flexibility of styling the ToC to suit your needs better. You may –

  • Choose which headings to include or exclude.
  • List the contents in one, two, or three columns.
  • Change the styling of the list to Bulleted, Numbered, or Plain.
  • Add a toggle that shows/hides the ToC.

Using a plugin is ideal if you’re looking for a more automated approach to creating a Table of Contents.

Conclusion

If you run a site with tens or hundreds of pages of content, it can be challenging to create a ToC for each page manually. In such a case, it is simpler to opt for the plugin as it does most of the work for you.

Using anchor tags removes the need for a plugin and keeps your page nice and lightweight. If you’re a newcomer, using anchor links is the better option, since it grants you control over your content.

Leave a Comment

Scroll to Top