Managing body classes in WordPress usually means digging into functions.php, hooking into body_class, and writing conditional checks for every template you want to target. Etch Body Class Manager moves all of that into the Template Manager itself, so you can add, remove, and customize body classes per template without touching a line of PHP.

The Body Classes Modal

Open Etch and navigate to the Templates screen. There you’ll see a new Body Classes button on each template card. Click it and you get a modal split into three parts: Global Classes, Template Classes, and Custom Classes. Each handles a different layer of what WordPress adds to your <body> tag.

Global Classes

These are the classes WordPress adds to every page regardless of which template is rendering it, things like wp-theme-* and your child theme’s class. Click any of them to disable it just for that template. Two classes, logged-in and admin-bar, show up highlighted because they only apply when a user is logged in, and they can’t be disabled since they’re tied to the session, not the template.

Template Classes

This section covers the classes WordPress adds based on the page type a template renders, things like wp-singular, single, single-post, and postid-{this.id}. Same idea, click one to turn it off. The one exception is catch-all templates like Index, where the page type classes depend entirely on whatever post ends up rendering through it, so the plugin can’t reliably list them ahead of time.

Custom Classes

This is where you add your own classes, either as plain static strings or as Etch dynamic data expressions wrapped in curly braces. Type a class into the field, hit Add, and it shows up as a chip you can remove later. Static and dynamic classes can sit side by side, so something like featured-post next to page-{this.slug} works fine.

Dynamic Data Expressions

Custom classes support the same expression syntax Etch uses everywhere else, so you can pull in things like:

{this.post_type}-{this.slug}
lang-{site.language}
user-{user.role}

These resolve server-side when body_class runs, using this to reference whatever post or page is currently being viewed. Any custom field data Etch already supports, ACF, MetaBox, or otherwise, is available the same way.

Using Modifiers

Etch modifiers work inside these expressions too, which opens things up quite a bit! A boolean ACF field can drive a conditional class:

{this.acf.is_featured.equal(true, "is-featured", "not-featured")}

The same pattern works for select fields or numeric comparisons:

{this.acf.color_scheme.equal("dark", "theme-dark", "theme-light")}

{this.acf.rating.greaterOrEqual(4, "top-rated", "standard")}

There’s also toSlug() for turning free text, like an author name, into something class-safe. Or something more creative like {this.date.dateFormat("l").toLowerCase()} if you want a class based on the day of the week, handy for editorial layouts that change depending on when something published.