How to Create a Table of Contents in WordPress Manually or With a Plugin

How to Add a Table of Contents in WordPress for Better User Experience and SEO

If you regularly publish long-form content on your WordPress site, you‘ve probably wondered if there‘s an easy way to help readers quickly navigate to the sections that interest them most. Luckily, adding a table of contents (ToC) lets you break up lengthy posts with jumplinks to each section, enhancing usability and on-page SEO.

In this guide, we‘ll explore what a table of contents is, why they‘re beneficial, and walk through how to manually add a ToC to your WordPress posts and pages. We‘ll also introduce you to the 12 best table of content plugins for WordPress that make this process much easier.

What is a Table of Contents?

A table of contents is a list of jumplinks, usually near the beginning of a page, that allow readers to quickly navigate to specific sections of your content. The ToC provides a convenient overview of the sub-topics covered and breaks up text-heavy pages. This improves readability and makes it simpler to find relevant information.

Tables of contents are especially useful for long-form articles, ultimate guides, documentation, and any page with distinct sections. Not only do ToCs enhance user experience, but they also provide a ranking boost by helping search engines understand your page structure. When you add a table of contents with descriptive anchor text for each section, this sends relevance signals to Google.

The Two Ways to Add a Table of Contents in WordPress

There are two ways to insert a clickable table of contents in your WordPress posts and pages:

  1. Manually adding a ToC using HTML code
  2. Automatically generating a ToC with a WordPress plugin

While the manual method works, it requires you to add HTML IDs to each of your section headings and create the ToC from scratch. This can be time-consuming, especially for longer posts. And if you update your headings down the road, you‘ll need to edit the HTML again to reflect those changes.

Alternatively, using a WordPress table of contents plugin automates the entire process. The plugin scans your page for subheadings and immediately renders a ToC based on your settings. If you make changes to your content, the plugin will dynamically update the ToC to match.

How to Manually Create a Table of Contents in WordPress

For those who want more control over their tables and don‘t mind a bit of HTML, here are the steps to manually add a ToC in WordPress:

  1. Edit the post or page where you want to insert your table of contents.
  2. Locate the first heading (h2, h3, etc.) that you want to include in the ToC.
  3. Switch to the Code Editor for that block.
  4. Add a unique ID attribute to the opening tag, like this: <h2 id="section-1">
  5. Repeat steps 2-4 for all the headings you want to include in the ToC.
  6. Place your cursor where you want the table of contents to appear.
  7. Paste in the following HTML, replacing the # values with your heading IDs and the link text with your section titles:
<div class="table-of-contents">
  <h2>Table of Contents</h2>
  <ul>
    <li><a href="#section-1">First Section</a></li>
    <li><a href="#section-2">Second Section</a></li>
    <li><a href="#section-3">Third Section</a></li>
  </ul>
</div>
  1. Save or publish the page.

Your table of contents should now appear with functioning jumplinks to each specified section. Keep in mind that this method requires you to manually edit the HTML whenever you change your headings or want to add/remove a section from the ToC.

The Pros and Cons of Manually Adding a ToC

Manually creating a table of contents in WordPress has its advantages and drawbacks:

Pros:

  • Greater customization and control over the ToC format
  • Doesn‘t require installing another WordPress plugin
  • Suitable for simple pages without many changes

Cons:

  • Takes more time to implement, especially for long posts
  • Requires basic knowledge of HTML
  • Must edit code whenever you change headings or sections
  • Easy to break the jumplinks if you‘re not careful

Overall, the manual table of contents method is best reserved for short, static pages or users who are comfortable manipulating HTML. For most WordPress sites, a dedicated ToC plugin is much more efficient.

12 Best Table of Content Plugins for WordPress in 2024

Using a WordPress plugin is the quickest and easiest way to add a table of contents to your site. Here are the 12 best table of content plugins available in 2024:

  1. Easy Table of Contents
    Easy Table of Contents is a popular free plugin that automatically generates a ToC from your page‘s headings. It offers a wide range of customization options, including the ability to specify which heading levels to include, alter the list formatting, and select between fixed or dynamic positioning. The plugin is fully compatible with the Gutenberg editor and WordPress 5.0+.

Key Features:

  • Supports both classic and Gutenberg editors
  • Option to manually insert ToC using shortcode
  • 4 counter bullet formats to choose from
  • Show or hide the ToC from certain pages/posts

Pricing: Free

  1. LuckyWP Table of Contents
    LuckyWP Table of Contents makes it ridiculously easy to insert a ToC anywhere on your page using a simple Gutenberg block. The plugin is well-suited for bloggers and content-rich sites, with a minimalist and responsive design that looks great out of the box. You can choose which headings to include/exclude, customize the list styling, and take advantage of the smooth scroll animation.

Key Features:

  • Lightweight and beginner-friendly
  • Drag-and-drop Gutenberg block
  • Color themes and custom CSS for design flexibility
  • Show/hide toggle to minimize the ToC

Pricing: Free

  1. Thrive Architect Table of Contents
    Thrive Architect is a premium page builder plugin for WordPress that includes powerful ToC functionality. With the click of a button, you can generate a table of contents block that automatically pulls in your heading structure. The ToC element is fully customizable, with options to change the color scheme, column layout, typography, and container styling to fit your branding.

Key Features:

  • Intuitive visual editor with 40+ design templates
  • Advanced animation and hover effects
  • ‘Highlight current section‘ mode for visual orientation
  • Responsive settings to control ToC on mobile devices

Pricing: Included with Thrive Suite ($19/month)

  1. Fixed TOC
    Fixed TOC is a sleek table of contents plugin built with user experience in mind. The plugin leverages a sticky sidebar that remains visible as visitors scroll, providing easy access to each section without having to backtrack. Fixed TOC offers a high degree of style customization and supports smooth scrolling, making it feel like a natural extension of your content.

Key Features:

  • Fully responsive sticky sidebar
  • 50+ eye-catching hover and scrolling animations
  • Option to collapse/expand individual headings
  • Detailed controls for colors, fonts, sizing, and effects

Pricing: $20 one-time fee

  1. Ultimate Blocks
    Ultimate Blocks is a feature-packed Gutenberg blocks plugin that includes a dedicated Table of Contents block. Adding a ToC is as simple as dropping in the block and configuring your settings, with no need to manually tag your headings. The plugin automatically assembles the ToC from h2-h6 tags on the page, with the ability to toggle heading levels on/off.

Key Features:

  • Gutenberg-native ToC block
  • Clean, minimalist front-end design
  • Option to display the ToC in one, two, or three columns
  • Support for multiple Tables of Contents on the same page

Pricing: Free

  1. Heroic TOC
    Heroic TOC is one of the most customizable free table of content plugins for WordPress. On top of automatically generating the ToC based on your headings, the plugin lets you rename each section, choose between bullets or numbers, and set a minimum number of headings for the ToC to appear. The ToC container can also be styled to match your theme.

Key Features:

  • Simple on/off toggle in the block settings sidebar
  • Specify an alternate title for the ToC
  • Choose the heading levels to include (h1-h4)
  • Custom colors for the ToC title, links, background, and borders

Pricing: Free

  1. CM Table of Contents
    CM Table of Contents is another user-friendly ToC plugin that automatically generates a table of contents for your posts and pages. You can choose to insert the table either above or below your content, or use the built-in widget to display the ToC in your sidebar. The plugin also supports smooth scrolling and lets you exclude specific headings from the table.

Key Features:

  • Automatic and manual insertion methods
  • Option to limit the ToC to a maximum depth
  • Customizable color scheme and typography
  • Translation-ready for multi-language sites

Pricing: Free

  1. Quickstart Table of Contents
    Quickstart Table of Contents is a lightweight plugin that makes it easy to add a responsive ToC to your WordPress posts. The plugin automatically detects your heading structure and assembles the table with a single click. You can choose to display the ToC at the beginning or end of your content, or insert it manually using a shortcode.

Key Features:

  • Compatible with both Gutenberg and Classic Editor
  • Option to hide the ToC on smaller screens
  • Supports smooth scrolling with adjustable offset
  • Custom CSS field for granular style control

Pricing: Free

  1. f4 Table of Contents
    f4 Table of Contents is a premium WordPress plugin that offers a nice balance of simplicity and flexibility. The ToC is automatically generated from your page headings and can be configured to appear globally or on a per-post basis. The plugin includes 10 pre-designed color schemes and multiple list styles to choose from, with the option to add your own custom CSS as well.

Key Features:

  • Conditional logic to control where the ToC appears
  • Specify the minimum/maximum heading levels to include
  • Adjust the scroll offset and animation speed
  • Customize the "Back to Top" link text and position

Pricing: $15 one-time fee

  1. WP Shortcode Pro
    WP Shortcode Pro is an all-in-one shortcode plugin that includes a handy table of contents shortcode. While not as automated as some other plugins, this is a solid choice if you prefer a manual approach with more control over which headings are included. You can easily insert the ToC anywhere in your content by wrapping your headings with the [toc] shortcode.

Key Features:

  • Ideal for users who want a simple, code-free solution
  • Supports both unordered and ordered lists
  • Includes additional shortcodes like buttons, accordions, and tabs
  • Works with any WordPress theme

Pricing: Free / Pro version starts at $17

  1. Neat ToC
    Neat ToC is a highly rated WordPress plugin that focuses solely on creating great-looking tables of contents. The plugin automatically generates a ToC from your headings, with options to customize the design, exclude certain pages, and specify the minimum number of headings required. Neat ToC is fully responsive and includes several stylish themes to match your branding.

Key Features:

  • Automatic ToC generation with real-time preview
  • 6 unique themes included, plus custom color options
  • Collapsible toggle to show/hide the ToC
  • Exclude headings by entering a CSS class or ID

Pricing: Free

  1. Table of Contents Block by WPZOOM
    Table of Contents Block is a straightforward Gutenberg block that helps you insert a ToC with minimal setup. Simply add the block to your post or page, and the plugin will automatically pull in all the relevant headings. You can choose to display the ToC as a bulleted or numbered list, and select which heading levels to include.

Key Features:

  • Native Gutenberg block for easy insertion
  • Lightweight and performance-friendly
  • Customize the ToC title and list style
  • No complicated settings or options to worry about

Pricing: Free

How to Choose the Right Table of Contents Plugin for Your WordPress Site

With so many great ToC plugins available, the right choice ultimately depends on your specific needs and preferences. Here are a few factors to consider when evaluating different options:

  1. Ease of use: If you‘re new to WordPress or prefer a hands-off approach, look for a plugin with automatic ToC generation and simple configuration options. More advanced users may appreciate plugins with granular controls and manual insertion methods.

  2. Customization: Consider how much control you need over the appearance and behavior of your ToC. Some plugins offer extensive style customization, while others prioritize simplicity with fewer design options.

  3. Compatibility: Ensure the plugin you choose integrates smoothly with your WordPress setup, including your theme, page builder, and other essential plugins. Check for compatibility with the latest WordPress version and Gutenberg editor.

  4. Performance: ToC plugins can impact your site‘s speed and performance, especially if they rely on heavy scripts or stylesheets. Opt for lightweight, well-coded plugins that won‘t slow down your pages.

  5. Price: While there are many excellent free table of contents plugins, premium options often provide additional features, design flexibility, and support. Determine your budget and whether the extra functionality is worth the cost.

By carefully evaluating your requirements and the available options, you can find the perfect table of contents plugin to enhance your WordPress site.

The Benefits of Using a Table of Contents Plugin

Adding a table of contents to your WordPress posts and pages offers several key advantages:

  1. Improved user experience: A well-organized ToC makes it easy for readers to navigate lengthy content and quickly jump to the sections that interest them most. This enhances usability and encourages visitors to spend more time exploring your site.

  2. Increased engagement: By providing a clear overview of your content structure, a table of contents entices readers to dig deeper into your post. This can lead to higher engagement, lower bounce rates, and more opportunities for conversions.

  3. Better on-page SEO: Search engines use headings to understand the main topics of your page. By including a ToC with descriptive anchor text, you reinforce the relevance of each section and make it easier for Google to crawl and index your content.

  4. Enhanced accessibility: Tables of contents are particularly valuable for visually impaired users who rely on screen readers to navigate web pages. A properly formatted ToC provides a clear roadmap of your content and improves accessibility for all visitors.

  5. Professional appearance: A sleek, functional table of contents adds a touch of professionalism to your site and shows that you value your readers‘ time and experience. This can help build trust and credibility with your audience.

By leveraging one of the powerful table of content plugins covered in this guide, you can effortlessly integrate these benefits into your WordPress site and take your content to the next level.

Conclusion

A table of contents is a small addition that can make a big impact on how readers interact with your WordPress site. By providing a clear, clickable overview of your posts and pages, you can boost engagement, improve navigation, and even increase your search engine rankings.

While it‘s possible to manually create a ToC using HTML, the process is time-consuming and requires ongoing maintenance. WordPress plugins offer a much more efficient solution, with options to automatically generate the table of contents, customize its appearance, and seamlessly integrate with your existing content.

Whether you opt for a free or premium plugin, adding a table of contents is a smart investment in your site‘s usability and success. By choosing one of the top-rated plugins from this guide, you‘ll be well on your way to creating a more engaging, user-friendly experience for your visitors.

So go ahead and give your content the navigation it deserves by implementing a table of contents on your WordPress site. Your readers (and search engines) will thank you.

Similar Posts