{"id":113286683,"date":"2020-07-17T09:19:08","date_gmt":"2020-07-17T06:19:08","guid":{"rendered":"https:\/\/thrivethemes.com\/?p=113286683"},"modified":"2022-01-18T16:09:28","modified_gmt":"2022-01-18T14:09:28","slug":"wordpress-table-of-contents","status":"publish","type":"post","link":"https:\/\/thrivethemes.com\/wordpress-table-of-contents\/","title":{"rendered":"The Only Table of Contents Solution You’ll Ever Need for WordPress"},"content":{"rendered":"

Do you find yourself glazing over when reading a long blog post or article?<\/p>\n

Or skipping ahead, searching for the actionable content?<\/p>\n

Worst of all, have you ever just given up reading, rather than face an intimidating wall of text?<\/p>\n

In this article, you\u2019ll learn how to solve these frustrations for your website visitors with a Table of Contents, and encourage them to keep reading what you have to share.<\/p>\n

Long content offers some great benefits, but it also creates additional challenges for readers… Visitors can feel overwhelmed by the sheer volume of reading, or lose their bearings halfway through.<\/p>\n

This is where a professional, powerful, and customizable Table of Contents<\/b> element can make a huge difference.<\/p>\n

A Table of Contents element like this…<\/p>\n

What is a Table of Contents, and why should you care?<\/h2>\n

A Table of Contents \u2013 often called a TOC \u2013 lists the major sections in a page of content.<\/p>\n

It\u2019s similar to a book\u2019s page listing, but has the added benefit of letting the visitor click to quickly jump down to each section. I\u2019m sure you\u2019re familiar with Wikipedia…<\/p>\n

\"\"<\/span><\/p>\n

Wikipedia’s Table of Contents<\/p>\n

A good Table of Contents element can transform a dull wall of text into an interactive, mini-navigation for your awesome content.<\/p>\n

Here\u2019s 6 solid benefits that a Table of Contents provides:<\/p>\n

    \n
  1. It sets the reader\u2019s expectations by showing the structure beforehand. This shows the skimming reader that your content is worth investing their time.<\/li>\n
  2. It lets the reader skip to a specific section, with the help of jump links<\/a>. If you can connect your reader to relevant content faster, they\u2019re less likely to get bored and leave.<\/li>\n
  3. It lets the reader dip in and out during multiple visits. Repeat visitors are more likely to become fans of your brand.<\/li>\n
  4. It allows sharing of direct links to individual sections.<\/li>\n
  5. It helps readers orient themselves, when used with sticky scroll behavior<\/a>.<\/li>\n
  6. It looks professional on long-form content.<\/li>\n<\/ol>\n

    When should you \u2013 and shouldn\u2019t you \u2013 use a Table of Contents Element?<\/h2>\n

    A Table of Contents is a great fit for these types of content:<\/h3>\n

    Long-form articles<\/span><\/h4>\n

    If you’re pushing over 1,500 words, you might want to consider a Table of Contents. This helps to let visitors know what to expect, so they feel informed before committing to a full read.<\/p>\n

    If you choose to make your Table of Contents sticky, it can also provide some always-available navigation, so readers understand where they are in the wider topic.<\/p>\n

    Structured content<\/h4>\n

    Table of Contents rely on structured sections or chapters, along with HTML headings like H2s and H3s. The article you\u2019re reading right now is a perfect example.<\/p>\n

    This lets your Table of Contents automatically update, and allows visitors to instantly navigate to a particular section of interest.<\/p>\n

    Structured content doesn\u2019t have to be long; your visitors might find a Table of Contents valuable on Q&A or list-type posts<\/a>, especially if there are repeated sections that are easy to get lost in.<\/p>\n

    Tutorials, guides and online course lessons<\/h4>\n

    Educational content often teaches an overarching topic or skill by breaking it down into steps or subtopics.<\/p>\n

    A great example of this is our Beginners Guide to Starting an Online Business<\/a> \u2013 this type of content becomes immediately more accessible and digestible when supported by a Table of Contents element.<\/p>\n

    A Table of Contents isn\u2019t suitable for these types of content:<\/h3>\n

    Short-form content<\/h4>\n

    Just like you don\u2019t need a page listing for a leaflet, you\u2019ll discover that content below 800 words rarely needs a Table of Contents.<\/p>\n

    For shorter, snappier content, it\u2019s best to let your readers jump in and follow the narrative from start to finish.<\/p>\n

    Non-structured content<\/h4>\n

    If you publish content without HTML headings, your Table of Contents simply won\u2019t work.<\/p>\n

    In general, we don\u2019t recommend publishing unstructured, stream-of-thought content. It\u2019s never ideal for your readers. If you\u2019re looking for guidance on how you can structure your content, read our post about content patterns<\/a>.<\/p>\n

    Utility pages that serve a specific function<\/h4>\n

    Sure, it\u2019s technically possible to add a Table of Contents to your homepage, category archives, 404 page etc, but does it offer any real value to your visitors?<\/p>\n

    Unless you have a compelling reason, then these utility or navigation pages are not ideal locations to feature a Table of Contents element on.<\/p>\n

    How to add a Table of Contents?<\/h2>\n

    You can add a Table of Contents element to any WordPress content.<\/p>\n

    The two most common applications are:<\/p>\n

      \n
    1. Static pages \u2013 like sales pages, course lessons and other long-form content.<\/li>\n
    2. Blog posts \u2013 like, well blog posts.<\/li>\n<\/ol>\n

      (Technically there\u2019s nothing stopping you from adding a Table of Contents to your homepage<\/a> or 404 page<\/a>, but we can\u2019t think of a compelling reason to do so!)<\/p>\n

      The next question you need to ask yourself is, do you want a Table of Contents on:<\/p>\n

        \n
      1. Every static page or blog post?<\/li>\n
      2. Or on just a few, selected ones?<\/li>\n<\/ol>\n

        Don\u2019t worry, we have a solution for each.<\/p>\n

        Add a Table of Contents to a single page or post<\/h3>\n

        The best tool for this job is Thrive Architect<\/a>.<\/p>\n

        Thrive Architect lets you edit the content of a page.<\/p>\n

        \"\"<\/span><\/p>\n

        Your content is displayed in an allocated area on your WordPress theme.<\/p>\n

        The article you\u2019re currently reading is a great example of adding a Table of Contents to a single post or page.<\/p>\n

        Here\u2019s how…<\/p>\n

          \n
        1. Open your page with Thrive Architect and insert a new element<\/li>\n
        2. Select the Table of Contents element<\/li>\n
        3. Drag and drop it onto the page<\/li>\n<\/ol>\n

          \"\"<\/span><\/p>\n

          Adding a Table of Contents with Thrive’s visual editor. It’s as easy as drag and drop.<\/p>\n

          Your Table of Contents doesn\u2019t have to feature at the very top of your content \u2013 you can place it anywhere you want.<\/p>\n

          Add a Table of Contents to every page or post<\/h3>\n

          The best tool for this job is Thrive Theme Builder<\/a>.<\/p>\n

          Thrive Theme Builder lets you edit your WordPress theme \u2013 the common elements that surround your content.<\/p>\n

          \"\"<\/span><\/p>\n

          Your theme surrounds your content on every page of your website.<\/p>\n

          Adding a Table of Contents element to your WordPress theme opens up a whole world of opportunities.<\/p>\n

          You can automatically show a clickable Table of Contents with every blog post, dynamically populated based on the headings in each, individual post.<\/p>\n

          You can also choose exactly where it should be displayed. For example, above the content or in the sidebar.<\/p>\n

          If you publish longer content with structured headings, this may be a gamechanger for improving readability and navigation!<\/p>\n

          The most important thing to remember when adding a Table of Contents to your WordPress theme is that it will dynamically change depending on the page that a visitor is viewing<\/b>.<\/p>\n