Published on May 17, 2020

[Condition] Body Class

Sridhar Katakam

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 $499 one-time).

Already a member? Log in below or here.

tagschevron-leftchevron-rightchainangle-rightangle-upangle-downfolder-omagnifiercrossmenuchevron-downarrow-right