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 lovers 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 »
  • HeloCheck

    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)!

  • Julia

    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!

  • George

    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?

    • http://www.wpbeginner.com/ WPBeginner Support

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

  • thomas

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

  • Anirban Pathak

    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.

  • barni

    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!

  • Natacha Neveu

    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!

    • http://www.wpbeginner.com/ WPBeginner Support

      We are glad you found it useful.

  • Ngan Son

    Great tips !

  • Mary

    VERY COOL.and a very helpful tip!

  • Zimbrul

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

  • Ravinder kumar

    Very helpful plugin…….Thanks

  • Sai Varun KN

    Great Plugin ! Offers better content navigation

  • Grant

    Neat and informative post!