Documentation
On This Page: Table of Contents documentation
How to set up and use On This Page: install, settings, shortcodes and fixes for common problems.
Overview
On This Page builds a linked table of contents from the headings in a post or page.
Where to find it: Settings → On This Page.
What you need
- WordPress 6.2 or newer
- PHP 7.4 or newer
Install
- With The Vault (easiest): open The Vault in your WordPress menu, find On This Page and click Install. It is installed and activated for you.
- By hand: download it free from the plugin page, then go to Plugins → Add New → Upload Plugin, choose the zip and activate it.
Updates arrive automatically from wpwizards.com, like plugins from WordPress.org.
Quick start
- Choose where it shows. Under Settings → On This Page, tick the post types under Use on.
- Pick automatic or manual. Leave Add automatically on to insert the table before the first heading, or turn it off and place the shortcode yourself.
- Write with headings. The table is built from your H2, H3 and H4 headings each time the page loads. There is nothing to update by hand.
Settings
Where it shows
| Use on | The post types that get a table of contents. |
|---|---|
| Add automatically | Inserts the table before the first heading. Turn this off if you place it with the shortcode, for example in a sidebar or a Divi Theme Builder template. |
| Only when there are at least … headings | Skips short posts. Applies to automatic placement only. |
| Headings to include | Which heading levels are listed. Sub-headings nest under their section. |
| Leave out headings containing | One word or phrase per line. Any heading containing it is skipped. |
How it looks and behaves
| Title | The label above the list. Default: On this page. |
|---|---|
| Open and close | Lets visitors collapse it by clicking the title. It can start collapsed never, on phones and tablets, or always. |
| Number the top-level items | Shows 1, 2, 3 beside the main sections. |
| Highlight the section being read | Marks the current section as the visitor scrolls. |
| Scroll smoothly to a section | Animates the jump when a link is clicked. |
| Space above a section | Set this to the height of your sticky header so headings are not hidden under it. |
| Accent color | Used for the highlight and links. |
Shortcodes
[on_this_page]
Shows the table of contents for the post or page being viewed. Works in a post, a sidebar widget, or a Text module in a Divi Theme Builder template. A post that contains the shortcode does not get an automatic one as well.
| Attribute | Values | What it does |
|---|---|---|
title |
text | A different title for this one spot, e.g. [on_this_page title="In this guide"]. |
min |
number | Only show when the post has at least this many headings. Default 1. |
class |
text | An extra CSS class on the wrapper. |
Place a shortcode in a Divi Text or Code module, a Shortcode block, or a widget.
Troubleshooting and questions
Does it change my headings?
It adds an id to each heading so links can jump to it. Headings that already have an id keep it.
How do I hide one heading?
Add the class no-toc to that heading, or list a word it contains under Leave out headings containing.
The table shows twice.
You have the shortcode in a template and Add automatically switched on. Turn Add automatically off.
Links stop under my sticky header.
Set Space above a section to the height of the header in pixels.
For developers
wpwotp_skip_auto_insert |
Filter. Return true to skip the automatic table for a given post. |
|---|
Get help
Stuck on something this page does not cover? Contact us and tell us which plugin and version you are on. Need it to do something it does not do yet? We build custom plugins too.
