How to Target CSS for Only the Home Page in Divi (or any WordPress Theme)

by | Sep 22, 2021 | Divi Tutorial, Wordpress Tutorial | 0 comments

In this quick Divi tutorial, I’ll show you how to target and apply CSS to just the homepage in Divi! However, this trick will work on ANY WordPress theme you use 🙂

In short, you can target the home page in Divi (or any other WordPress theme) by putting “.home” in front of any CSS element.

For example, if you wanted to have a transparent menu on just the homepage, you can add this CSS:

.home #main-header {
    background: transparent;
}

When you put the “.home” class in front of any CSS element, those customizations will only effect the homepage and not the rest of the website.

This isn’t likely an effect that you’ll use too often but it’s super handy when you want to make the homepage of a website look much different than the rest.

Enjoy!


Additional helpful resources:

Ready to Learn CSS for Divi?

Watch my FREE 1-Hour Video Training Masterclass!

"A Beginners Guide to CSS for Divi"