Icon Table of Contents and Menus
Long documents with multiple headings are sometimes difficult to scan, especially on mobile devices. This plugin helps by providing an icon at the top of the page under the main heading which, when expanded, provides a table of contents (ToC) with bookmarks to all of the main headings in the content below (h1 to h4). It can also be used to display WordPress menus using the same icon interface.
How does it work?
To generate the table of contents for the current page content the plugin parses the current page content into a DOMDocument and then uses DOMXPath to find all of the main heading elements (h1 to h4). It adds bookmarks for each of these headings and then builds a nested unordered list linking to them as a DOM fragment. This gets inserted back into the main DOMDocument object. Finally, the generated DOMDocument is returned as a string for output into the main page content.
The menu version of the plugin doesn’t have to parse any content. Instead it just loads in the menu details using the WordPress wp_get_nav_menu_items() function and iterates through them building an unordered list as a string. This is then inserted into a template and displayed on the page.
Download & install the zip archive
The plugin package installer can be downloaded from the WP2E project tab called “code”.
1 – Select the version to download if this option is available otherwise the “latest” version of the main plugin will be used.
2 – After downloading the zip archive install the plugin package installer in you local environment and activate the script from the plugin list.
3 – Under the section “Plugins” of the admin dashboard you should see a new “Dependencies & Licenses” link. Follow the instructions from this panel to finalize the installation of the missing dependencies.
-
- Give a name to your project
-
- Download the Installer Package
-
- Install & activate the plugin locally
-
- Install the suggested dependencies
Tips: Use the WP2E panel to add/suggest new dependencies to the local installation. Press F5 in the list of dependencies if the changes are not displayed right away.