How to Exclude Comments from Table of Contents Widget in Elementor

Updated: October 4, 2021

Elementor has a default widget called Table of Contents which you can use to add extra navigation feature on your website. With this widget, you don’t need to install an additional plugin only to add table of contents on your WordPress site. The Table of Contents widget itself can be used anywhere on your website, including blog posts. If you want to add table of contents on each blog post using the Table of Contents widget of Elementor, you can create a custom template for the single post using Elementor Theme Builder.

The way the Table of Content widget works is pretty similar to other ToC plugins whereby it generates the list items of ToC by HTML headings. If you use the widget on a custom single post template, chances are the comments section is included in the list. How to exclude it?

The Table of Contents widget allows you to exclude list items by CSS selector. Therefore, you need to figure out the CSS selector of the comments section on the theme you use. In most cases, you can find it on the comments.php file of your theme. To access this file, you can go to Appearance -> Theme Editor on your WordPress dashboard. Select comments.php on the right panel.

Once the file is selected, find the CSS selector on the editor box. In our case, the selector for the comments section is comments-area as shown on the screenshot below.

Next, go to the Elementor editor and edit the Table of Contents widget. On the Table of Content block under the Content tab, click the EXCLUDE tab and paste the CSS selector you have found above on the Anchors By Selector field. Add a dot as the prefix.

If you want to exclude other sections, you can simply add the CSS selector of the sections you want to exclude on the Anchors By Selector field. You can separate each CSS selector with a comma.

Originally posted on: October 4, 2021

This page may contain affiliate links, which help support WP Pagebuilders.

Building a website is as fun as playing puzzle with Elementor

Leave a Reply

Your email address will not be published. Required fields are marked *

Pin It on Pinterest

Thanks for commenting

Help us grow by sharing this post with your friends!

Support Us

Consider subscribing to help us grow. Get the regular articles about page builder plugins and WordPress in general.