The Easiest Way to Add Table of Contents in WordPress Posts or Pages

Adding a table of contents to your WordPress posts and pages helps your readers to easily navigate a long article and helps Google create structured links in search results. It is one of the best things you can do to improve user experience in long article posts by giving your readers a structured way to navigate your pages and posts. In this article, we’ll show you the different ways in which you can add a table of contents in WP to posts and pages. This includes manually adding a table of contents for posts and pages without having to download a plugin, or simply using a plugin.

Adding Table of Contents Using a Plugin

Obviously, using a plugin to add a table of contents is the easiest and fastest way. And there are plenty of plugins you can find to help you add a table of contents to your posts and pages. Our favorite table of contents plugin is the Easy Table of Contents WordPress plugin, which is, indeed, very easy to use. With this plugin, there’s not much to beat around the bush – it basically extracts all the headings from your posts or pages and creates a table of contents.  If you are keen to see how it looks like, then you can see it on this post, or any other posts on AllinAllSpace. However, if this plugin is harming your site performance or does not work well for any other reason, you can also use another table of contents WordPress plugin. From my knowledge, some of the best WordPress table of contents plugins include the Ultimate Blocks, Top Table of Contents, and the Affiliate Booster plugin (also the ability to use table of contents via this plugin requires a premium account).

Manually Adding Table of Contents in WordPress Gutenberg

Gutenberg, which was released in 2028, is the newewst editor for WordPress, and is very likely to be the most used editing version among WP users. Manually adding a table of contents on Gutenberg is fairly easy. Here’s how it can be done:

1. First, you need to add a heading. For demonstration, we used this as H2 heading – Manually Adding Table of Contents in WordPress Gutenberg.

2. Now that you have several heading along the article, you can manually create a table of contents.

3. Next, highlight the H2 heading, and click on the Edit HTML button.

4. After the “wp-block-heading”, add id=”the text added in the heading HTML code”, and click again on the Edit Visually button. In our example, as you can see we added id=”manually”.

5. The last step you need to take is to highlight the heading text in the table of contents. Then, click on the insert link button, and add #the text added in the heading HTML code. In our example, as seen in the image below we added #manually.

Manually Adding Table of Contents in WordPress Classic Editor

If you are using WordPress classic editor, then here’s how to manually add a table of contents to a WordPress post or page:

1. First, you need to add H2/H3/H4 title in the body of the post. For demonstration, below we created this H2 title – Add Table of Contents in WordPress Posts or Pages.

2. Then, click on the text tab where you can see the H2/H3 title HTML code. Here, you need to navigate to the code editor. Once this is done, you’ll need to add id=”title” after the <h2. In our case, id=”Add Table of Contents in WordPress Posts or Pages.”  3. Almost done. The last step you’ll need to do is to link the title in the table of contents to the H2 in the body of the article. Go back to the visual format and add the H2 title as one of the titles in the table of contents. Note that in terms of SEO, you do not want to upload the table of contents in H2/H3 format, so you won’t have two similar H2 titles in the article. In order to link the title in the table of contents to the H2/H3 title in the article, you must add the same title with # before the title in the link box in the same way you insert any link. See the image below.

---

---

That’s it. We hope this article helped you understand how to add a table of contents to WordPress posts and pages. We also recommend reading our full Kinsta review and our article about the best tools and plugins for web development.