0

As the title says, How can I add a custom CSS to all posts without affecting homepage CSS on WordPress?

And I know that some plugins like "WP Add Custom CSS" would work for this and I am actually using it, and it does work but, what I want to do is give all my posts the same exact code, I don't want to give every post manually the same code over and over.

Because if I wanted to change this code later on, then I will have to go back and edit every post that I made with this new code change.

For example, I have this CSS code:

.post-meta {
    margin-right: 0px !important;
}

Every post needs to have this code but without affecting homepage CSS.

2 Answers 2

5

By default, WordPress sets various classes to <body> depending on which page, template, parent, .. you are on. For a single post, some of these are single and single-post, so you could use the following

body.single.single-post .post-meta {
    margin-right: 0px !important;
}
3
  • And what if I wanted the opposite? I want only the homepage to be changed only. Commented Feb 22, 2018 at 13:08
  • 3
    Never mind I got that, I could use .homepage Commented Feb 22, 2018 at 13:34
  • @DragoonShimizu Sorry, just got back but glad you found the solution yourself! It can be interesting to check the <body> of specific pages. WordPress will almost always set specific classes (at least the specific id), which you can use in your CSS
    – kero
    Commented Feb 22, 2018 at 16:48
1

Most themes add the class of home to the body element on the home page, so providing yours does you can easily target everywhere else except for the home page using the :not() pseudo-class.

body:not(.home) .post-meta { ... }

Hope that helps

Not the answer you're looking for? Browse other questions tagged or ask your own question.