Alternating background color on posts and pages

Hi Chintan,

We can try doing it through CSS. If you can provide that link to your posts page, we’ll try to provide the CSS.

Hope to hear from you soon.

Hi Fernando,

I want to do it for all of the posts.

Best,
Chintan

Can you provide the link to your posts?

Hi Ying,

Sure, shared it in the private info section. Thank you!

You can give this CSS a try for pages, but I don't think it's a good idea:

.page .entry-content >.gb-container:nth-child(odd) {
    background-color: grey;
}

Oh I don't want it for pages. I want it for posts. Where should I add this CSS for global changes in posts? Actually I am 301 redirecting the "blog" page of the website to this custom page because I want a static one to be there. Maybe that affects the code as well?

Hi there,

looking at your site reverting back to your original question, ie. can it be done automatically. The answer is NO, not with how that example post is constructed.

For it to work you would need to:

a. Set the Content Container for the post(s) to Full Width:

https://docs.generatepress.com/article/content-container/

b. Make sure each section is clearly defined by a single parent container block.For example on your sample post the first Container Block only has a single headline. You will need to ensure you divide the page how you want it displayed.

Then something like Yings CSS can be applied to posts or pages.
But you need to construct the content and because of that you may just as well style it in the post editor as your write the post.

Hi David,

Are you sure we can't apply a condition in CSS across the whole site to change the background for all the posts at every alternate H2? And I am sorry I have shared multiple examples in the private info field (which are no longer visible to me), so I have lost the context of which ones I mentioned. But to reiterate I want this to happen for all the "posts" on WordPress or pages.

I can understand how to manually change the color for each section I want, but if it can be done at scale would be of great help!

Thank you.

Believe me, if there was an auto-magical way of doing it, i would tell you. The HTML stucture has to exist on the page. heres one of the sites you gave as an example:

https://www.screencast.com/t/yBPUqLYh

You can see in the HTML on the right, each section with a different color background is a separate section in the HTML.

If you don't add the HTML then we can't style it.

Oh alright. Thank you.

You're welcome