jQuery Table of Contents (jQuery TOC) is a WordPress plugin that automatically organizes specified heading tags in a post into a table of contents, making it easier for readers to jump quickly to a particular section. By default, it uses h2 headings, and each heading also becomes a link back to the top of the page.
Table of Contents
jQuery Table of Contents
After installing jQuery TOC, the basic setup is simple. The main things to confirm are the selector for the post content area and the heading tags to include in the table of contents.
jQuery Table of Contents Settings
jQuery content selector
Here you specify the div ID or class used for the WordPress post area. Using the theme I had at the time as an example, the post area was #content .contenttext; the plugin's default value was .single .entry. If you use a different theme, you must change this to the actual style ID or class used by that theme. Otherwise, the plugin may not be able to find the post content, and therefore will not generate the table of contents correctly.
Header Tag
This setting determines which heading tags are used to form the table of contents. The plugin defaults to h2, while this site uses h3. If your post structure uses h2 for main headings and h3 for subheadings, choose the corresponding tag according to your actual needs.
Once the settings are complete, longer posts can automatically generate a table of contents, making it easier for readers to browse and navigate.