The power of the Elementor Display Conditions – tag based template

By Anne-Mieke Bovelett on May 15, 2022
Status: Up to date

A no-plugin and no-code solution to hide or show stuff in your blog template

In the Global Elementor Community on Facebook, someone asked today: “Is there a way to hide empty Table Of Content with CSS?
Some of my posts have headlines, but the others do not.”

Steps to one of the easy ways to achieve that

1. Create a tag in the WordPress Dashboard under posts, called “no headlines”.
2. Create a duplicate of the blog template you have that Table of Content widget in, but leave out the TOC widget. I’d go for importing the original template in the new template and then simply remove the TOC widget from the new one.
3. Upon saving that blog template, set display conditions to:
   Include: Singular, then choose under Post: “In Tag” and then, in the field that appears next to it, type the name of the tag you created, see screenshot below this steps list.
4. Hit Save & Close.
5. Open the post(s) that have no headlines and that don’t need the TOC widget, and in the sidebar on the right, under tags, type the first letters of your tag name. Autocomplete will show the full tag name. Select it.
6. Save your post.
7. Have a look at the front end. You will see that post now displays the template without the TOC widget.

Example of the settings

When my website was still built with Elementor, I used this exact method for the footer. Every time I have a post that contains an affiliate link, I give it the tag I created for that purpose. Tadaaa, the footer with the affiliate text appears below that blog post.

But this principle doesn’t just work in Elementor. It also works very well in GREYD Suite when you use “Conditional Content”. I will make a tutorial about it in the future.