This members-only tutorial provides the code for registering a custom condition using which elements can be output depending on whether the current page's body has the given class or not.

Any element to which this condition is applied will only be output if "page-id-23" is one of the body classes for that page

Both == and != operators shall be set so that it is possible to check if the page either has or not has the entered class.

Use Case

Let's say you want to show a section only on all single posts but not the rest of the pages on your site.

Inspect any single post with your browser DevTools and look for the body tag. It could be something like this:

<body class="post-template-default single single-post postid-299 single-format-standard  wp-embed-responsive theme-oxygen-is-not-a-theme oxygen-body woocommerce-js oxygen-aos-enabled" data-aos-easing="ease" data-aos-duration="400" data-aos-delay="0">

The single-post class is unique to all single posts in WordPress.

So you could enter it for the class name in your condition for the Section and it will be output only on all single posts.

Similarly WordPress provides useful classes for different views. You can find the list here.

Step 1

Install and activate Code Snippets plugin.

Go to Snippets > Add New.

Title: Body Class

Code:

This is a premium members-only content.

To view the rest of the content, please sign up for membership ($47/month or $399 one-time).

Already a member? Log in below or here.

Need help implementing a tutorial in your site or want to hire me for custom work?

HIRE ME

Find the article helpful and wish to donate?

DONATE

Comments

You need to be logged in to view and post comments.
Not a member yet? Join here.
magnifiercross
>
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram
%d bloggers like this: