Want to make a table of contents with Elementor? Then you’re here.
A table of contents helps readers explore your blogs/articles. It explains the post. They don’t need to read the whole article if they’re researching a certain issue. They can jump to the chosen blog post topic using the table of contents. Time-saving.
This article explains how to generate a table of contents using the Elementor PowerPack widget. PowerPack TOC Widget lets you add an interactive table of contents without coding.
Elementor’s TOC widget has various stylistic issues. If you know HTML and CSS, you can simply customize the Elementor TOC widget. If you want to customize the table of contents without CSS and coding, utilize PowerPack Advanced TOC widget for Elementor.
Before starting the tutorial, let’s review the TOC widget’s essential characteristics.
Key Features of Table of Contents Widget
- You can change the PowerPack Table of Contents’ table title.
- CSS selectors provide you the flexibility to include/exclude specific headings/sections of a page. This provides you control over which titles appear in your table of contents.
- ToC widget allows list formatting. List styles include none, bullets, and numbers.
- Enable Word Wrap to generate a nice table of contents with extensive headings.
- ToC collapses based on the device. Be it a smartphone or laptop screen. Your table of contents can be hierarchical.
- A “Sticky” table of contents is beneficial for long-form content. This feature scrolls the content list with the page.
How To Create Table of Contents with Elementor?
Open the page you want to alter in the Elementor page editor first. This will allow you to add a table of contents. The next step is to locate the elementor table of contents widget within the elementor widget panel.
Put the table of contents where you want it on the page by dragging and dropping it. Make certain that you check the PP icon that is located in the top right corner of the widget.
After you’ve added the widget, you’ll see that the PowerPack TOC Widget analyzes the headings of each page and presents them in the form of a table of contents.
The first item that allows you to edit the contents of your table is called the content tab, and it has a number of different options. You can, for instance, edit the title of the table, omit or include header tags, select the list style, enable word wrap, and select from a wide variety of additional settings.
The following is a tab for our style. You are provided with a comprehensive menu of available customization options here. With the help of these options, you’ll be able to construct a table of contents that flawlessly complements the overall appearance and layout of your website.
I really hope that you find this post to be informative. You are able to generate an interactive Table of Contents for every page on your website by using the PowerPack plugin. Share with us the process that you use to produce the table of contents for your site.