Home » How To » How to Add a Table of Contents in WordPress [Step-by-Step]

How to Add a Table of Contents in WordPress [Step-by-Step]

Add Table of Contents in WordPress

Would you like to improve the user experience of your website by adding a table of contents to your WordPress blog posts?

A table of contents is a list of links to all the main headings in a post. The TOC makes it easy for readers to navigate through long posts. A table of contents can also be helpful for search engine ranking.

Adding a table of contents in WordPress is a very simple process. However, sometimes it can be a little tricky for beginners. Therefore, in this article, we will cover the complete process to create a table of content for your WordPress posts and pages.

Before we start the guide, let’s discuss the benefits of adding a table of contents in longer content.

Why Add a Table of Contents in WordPress Posts

A table of contents is very helpful for longer WordPress posts because it allows readers to quickly find the information they are looking for. Instead of reading the whole article, users can see the table of contents and go to the section they need.

Adding a table of contents also improves the look of your website’s search results in search engines. If your blog post has a table of contents, Google will automatically show links to each heading in the table of contents on the search results page.

Overall, A Table of Contents helps you to improve the readability and SEO of your website. Now, we’ll show you how to create a table of content for your WordPress posts and pages.

How to Add Table of Contents in WordPress Posts

Here, we have three different methods to add a table of contents in WordPress. In the first two methods, we’ll make use of free plugins to create TOC. And in the last method, we’ll show you how to do it manually without using any plugin.

1. Using a Dedicated Plugin to Automatically Create a Table of Contents

  • First, install and activate the “LuckyWP Table of Contents” plugin.
  • After activation go to Dashboard>>Settings>>Table of Contents.
  • Now, on the plugin interface, you will see multiple tabs at the top. Click on the “Auto Insert” tab.
  • Here, you’ll see an option to enable “Auto Insert Table of Contents”. Tick the checkbox available there. Then, a couple of other options also became visible there.
  • After that, select the position of TOC from the drop-down menu. The best position to add TOC is “Before first heading” or you can choose according to your requirements.

Enable Auto Insert Table of Contents

  • Now, the next option is “Post Types”. Here you can choose for which post types you want to enable auto insertion of TOC. We recommend enabling it for only posts. For pages, you can create TOC manually directly from your WordPress page editor. After setting up all the options, click on the “Save Changes” button.

Create Table of Contents Using a Plugin

  • That’s it, A Table of Contents is successfully added to your all WordPress posts. To confirm open any of your blog posts.

2. Using the Default WordPress Block Editor

  • To add a table of contents using WordPress default editor, we need to take the help of a free plugin called Spectra.
  • So, first of all, install and activate the “Spectra” WordPress plugin.

Installing Spectra WordPress Plugin

  • After activating the plugin, go to Dashboard>>Settings>>Spectra>>Blocks/Extensions and make sure the Table of Contents block is enabled.

Enabling Table of Contents Block

  • Now open the editor of the post or page where you want to add TOC. Then, click on the “+” (Plus) sign and search for the “Table of Contents” block.

Search and Add Table of Contents Block

  • Now, the block will automatically generate a table based on your post’s headings. Whenever you add a new heading in the post, it will be automatically included in TOC.

Creating Table Of Contents Using Blocks

  • That’s it, a table of contents is successfully created for your WordPress post. In the same way, you can add it to your all posts and pages.
  • It also allows you to do plenty of customization. To customize it, click on the “Settings” button of the block editor then select the table of contents block.
  • Now at the sidebar, a setting panel with multiple customization options opens up. Here, you can enable/disable the heading levels that you want to include in TOC, align options, change background color, enable smooth scroll, make TOC Collapsible, and many other basic customizations.

Customization of Table of Contents Block

3. Adding a Table of Contents Manually in WordPress [Without Any Plugin]

  • First of all, add a “list block” at your preferred location, where you want to create the table of content.

Adding List Block

  • Then, type all headings of your post into the list.

Manually Creating Table of Contents

  • Now, you have to add an anchor attribute to all heading blocks in your post. So, click on the first heading of the post. A block setting pane will open up for the selected heading. There, you need to click on the “Advanced” arrow. After that, enter a unique anchor text without any spaces in the empty field for “HTML anchor”. You have to do this for all headings one by one.

Creating HTML anchor Attribute for Headings

  • After creating the HTML anchor for all headings, you have to link them with the headings we typed in the list. So first, select the first heading of the list and click on the “link icon” available in the toolbar.

Linking Table of Content Heading with Their HTML anchors

  • Then, you have to type the HTML anchor text (you created it in the previous step) with the hashtag in the URL field. Once done, press “Enter” to add the link. In the same way, you have to link all other headings of the list with their HTML anchor attributes.

Adding HTML anchor to heading link

  • That’s it, a table of contents is successfully created for your post. You can repeat the above steps to generate TOC for your all other WordPress posts and pages.

Creating Table of Contents Manually

Leave a Comment