How to Exclude Specific Headings from Table of Contents Widget?

You might have come across a case or find it difficult to exclude certain headings from the table of contents on your website? We have made it possible or simplify to exclude specific headings in the Table of Contents widget of UAE.

Let’s see few cases and how we can overcome this in our Table of Contents widget.

Case 1: Hide Headings from the Single Post Page

If you have a Single Post page, where you are displaying related posts below the post content using Posts widget. The Table of Contents widget will consider the headings of the related posts in the table of contents.

Solution: To remove or exclude the headings from the table. Here you will only need to add a CSS class to Posts widget whose headings you want to exclude.

CSS class you will need to add is – uae-toc-hide-heading

The CSS class will need to be added under the Advanced Tab > Advanced section > CSS Classes

Case 2: Hide Headings from the Single Page

On a single page, you might have multiple section headings with Table of Contents widget, and need to exclude a specific heading in the table. But, here few headings are added using the Text editor and you don’t need to hide all the headings of the text editor, just the second one.

Solution: The previous solution will work a similar way even here. Just go to the Text Editor and find the specific heading to be excluded, and go to the text tab which is beside the Visual section.

Now, let’s say you have h3 tag so you will add the following in the tag – class=”uae-toc-hide-heading”. Refer the screenshot on how it needs to be added.

After you add the class to the heading tag and the heading will be excluded from the table. Hit Update or Publish the page with the changes and you will see the heading to be excluded.

Here’s the GIF on how to do this –

Similarly, if you find any other case, you will need to add the uae-toc-hide-heading to exclude any specific heading.