Beginner's Guide for WordPress - Start your WordPress Blog in minutes.
Choosing the Best
WordPress Hosting
How to Easily
Install WordPress
Recommended
WordPress Plugins
View all Guides

How to Create a Table of Content in WordPress Posts and Pages

Last updated on by
Follow WPBeginner on YouTube
How to Create a Table of Content in WordPress Posts and Pages

Did you ever want to add a Wikipedia like table of content box on some of your long articles? A table of content makes it easier for users to jump to the section they want to read. It also helps with SEO, as Google automatically adds a jump to section link when your site appears in search results. Although you can manually create a table of content by writing custom HTML, it can be difficult for many WordPress beginners. In this article, we will show you how to create a table of content in WordPress posts and pages without writing any HTML or CSS.

A jump to section link in search snippet

Video Version of the Tutorial

If you don’t want to watch the video, then continue reading.

First thing you need to do is install and activate the Table of Contents Plus plugin. Upon activation, you need to configure plugin settings. Simply click on Settings » TOC+ in your WordPress admin area.

TOC+ Settings

In the Main Options tab, you can select where and when you want your table of contents to appear. The default position is ‘before the first heading’. This means that the table of contents will be displayed before the first heading tag in your post or page. You can change it to top, bottom, or after first heading.

The next option is to decide when you want the table of content to appear. By default, the plugin will display table of contents if a post or page has more than 4 heading tags. You can change that to a lower or higher number.

The plugin will display Table of Contents only on pages by default. However if you want to enable automatic generation of table of contents for your posts as well, then all you need to do is check the box next to Post under the option ‘Auto insert for the following content types’. Check out our guide on the difference between Posts and Pages in WordPress.

Table of Contents Plus comes with a few default skins. You can choose them under the Presentation option. There is also an option to create your own custom style for your table of content box.

Choose a skin of your table of contents box

Once you are satisfied with the settings, click the Save Options button to store your settings.

How Does It Work?

The plugin will automatically generate table of contents for an article if it matches the criteria in your settings. By default it will generate the TOC if a page or post has at least four heading tags. These heading tags could be <h1>, <h2>, <h3>, <h4>, etc.

Table of contents in a WordPress post

If you do not want the plugin to generate table of contents for an article, then you can simply add the following shortcode to disable the table of content.

[no_toc]

Remember, if you feel that you’re consistently adding this shortcode in your posts, then it might be worth it to change the plugin settings and/or disable auto-insertion option. The reason why we suggest this is because using using shortcodes in too many posts can be problematic.

If you disable auto-insertion, then you can use the following shortcode to insert Table of Content in your post or page:

[toc]

If you want you can also display the table of content box in your sidebar widget. Simply go to Appearance » Widgets to drag and drop TOC+ widget in a sidebar. You can check the box next to ‘Show the table of contents only in the sidebar’ to display table of contents only in the widget and not in the post or page.

Table of contents displayed in a sidebar widget

We hope this article helped you add table of contents in your WordPress posts and pages. For feedback and questions please leave us a comment below or join us on Google+ or Twitter.


Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi. Page maintained by Syed Balkhi.

WPBeginner's Video Icon
Our HD-Quality tutorial videos for WordPress Beginners will teach you how to use WordPress to create and manage your own website in about an hour. Get started now »

Comments

  1. HeloCheck says:

    While post it is a bit old it helped me a lot as I was looking for a TOC plugin to get the job done easily and fast.

    Thanks a lot for the post which helped me find the right plugin for my needs (not the first one I try out)!

  2. Julia says:

    Hey all — I’m very new to WP. Will this work on the totally free version of the site, or just for paid WP sites? Thanks!

  3. George says:

    Nice post! But will this affect any page without TOC? ‘Cause some plugins does.. Is this way SEO-friendly and free of adding code to every other page?

    • WPBeginner Support says:

      No it will not affect any pages without TOC. Yes this way is SEO Friendly and you don’t need to add code.

  4. thomas says:

    what’s about this Table of Content Generator?
    http://wordpress.org/plugins/table-of-contents-generator/

  5. Anirban Pathak says:

    This is a nice article. We’re glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and all links are nofollow.

  6. barni says:

    Thanks for the share. I was actually looking for this solution to be use on a medical site I’m powering with WordPress. Thanks a million!

  7. Natacha Neveu says:

    Thanks for this article, it’s really helpful – I’m not very ‘technical’, but thought I would install it and have a play around. I didn’t really see how it would work with my type of posts and content, but it turns out that in having a play, I was able to work out how to adapt the plugin/widget for my site and found a way that I liked to use it. Thanks again!

  8. Ngan Son says:

    Great tips !

  9. Mary says:

    VERY COOL.and a very helpful tip!

  10. Zimbrul says:

    I didn’t know about this but definitely helps to organize content on a page.

  11. Ravinder kumar says:

    Very helpful plugin…….Thanks

  12. Sai Varun KN says:

    Great Plugin ! Offers better content navigation

  13. Grant says:

    Neat and informative post!

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.