In my post, I show you how to create a table of contents in WordPress without a plugin, step by step.

A table of contents helps your visitor find the information they need quickly. The internal links jump to the part of your post your visitor wants to read.

Here is an example of a table of contents on my website. It is simple to create. You don’t need a plugin or have to input any code. Each step is a link to a heading on the same page.

table of contents example

Let’s get started.

Table of contents

  1. Step One – Create A List Block In Your Blog Post
  2. Step Two – Write A Sub-Heading
  3. Step Three – Create An Anchor Link
  4. Step Four – Add Links To Your List Block
  5. Step Five – Add More Items To Your Table Of Contents
  6. How To Create A Table Of Contents In WordPress Video Tutorial
  7. Conclusion

Step One – Create A List Block In Your Blog Post.

First, on your blog post, click on the plus icon to create a new block.

create a list block

Type ‘List’ in the search box, then select the ‘List’ icon.

The list block is your table of contents. You have the option of showing dots or numbers on the left.

list block

Step Two – Write A Sub-Heading.

The ‘List’ block has links to your sub-headings within your post. Therefore, you need to write your sub-headings first.

To create a sub-heading, click on the plus icon. Type ‘Heading’ in the search box, then select the ‘Heading’.

heading block

The default heading is H2. Your blog post title is H1.

heading block

Next, write your first sub-heading.

First heading

Step Three – Create An Anchor Link.

The first sub-heading is going to be a link destination, the anchor. Next, on the right of the editor, open the ‘Advanced’ tab.

Advanced tab

In the ‘HTML anchor’ box, type one or two words without spaces relevant to the heading.

Anchor text

The HTML anchor is the destination for your link, the anchor.


Advertisement

Free WhoisGuard with Every Domain Purchase at Namecheap

Step Four – Add Links To Your List Block.

Next, start creating your table of contents. Go to your list block and type the text for the first sub-heading.

first heading

Now, highlight the text in your list block to make the toolbar appear. Then, select the ‘Link’ icon.

toolbar

In the search box, type a ‘#’ followed by the text in the ‘Advanced HTML anchor’ box from step 3.

hashtag

Don’t forget to add the ‘#’ before your text. The hashtag tells WordPress this is an anchor link on the same page. Finally, select the ‘Submit’ icon to make your link live.

submit

After you select ‘Submit,’ your text will change colour to indicate it is now a link.

live link

Now the items in your list block link to your headings. When your visitor visits your post, they can click on any item in your table of contents and skip directly to that part of your blog post.

Step Five – Add More Items To Your Table Of Contents.

Continue adding text to your table of contents and create links to your post headings following the steps in this tutorial.

How to add another item to your table of content

Don’t forget the hashtag when creating links and ensure the text is an exact match to the text in the ‘HTML anchor’ box. If you do not have the hashtag or the text is different, the link won’t work.

I recommend after you publish your post. Open your blog post and test the links are working.

How To Add A Table Of Contents Video Tutorial

Conclusion

Now, you can add a table of contents to your blog posts without a plugin. The process takes just a few moments.

I add a table of contents to all my blog posts to help visitors find information quickly. You must create the best possible experience for your visitors.

Before you return to your blog to add a table of content to your posts, may I ask for one minute of your time to leave a comment? I love reading comments from visitors to my site. I appreciate any feedback you have about my content.

If you enjoy learning WordPress through video, then please check out my YouTube channel. I look forward to seeing you again soon.

Similar Posts

22 Comments

  1. I like to read well-written articles. It looks like you spent a lot of time and effort on your blog. I learned a lot from your article and I have already bookmarked and am waiting to read a new article. keep up the good work!

  2. So I went through and created all these links to headings on my page, but when I click on the link, it brings me to just below the heading. I want it to bring me to the heading so the heading is visible. Is that possible?

    1. Hello Erin, thank you for your comment. On my website, the links go to the heading. Are you using the latest version of WordPress.org?

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.