Site logo

Archived topic

Change background color on Single Post

17 replies · Started by Muhammad on September 18, 2019

Viewing posts 1–15 of 18

Hi. I want to change the background color on single Post only. If i change the background color from customizer, it changed across site. I need to change for other than archives pages.. which essentially means only for single post and single page.

it changes the background to black. I want to change background of the container on single post to white and not the post content background.

So the body background?

Try this instead:

body.single, body.page {
    background-color: #fff;
}

Works like a charm. Thanks. Also how to centralize title of the post and Date and Author name. ?

Try this:

body.single .entry-header {
    text-align: center;
}

Let me know :)

it works on single post but at the same time it also centralizes headings on home page. I want it only single post.

Works perfectly. and last thing. How to change width of title to 1020px?

Not possible to break out the title block from the content container.

A workaround solution would be to create a header element with the template tag:
https://docs.generatepress.com/article/header-element-overview/
https://docs.generatepress.com/article/header-element-template-tags/#post_title

You can see some examples here:
https://docs.generatepress.com/article/page-hero-examples/

Once you do that, I can provide the CSS to change the width of the header element.

Let me know :)

hi. I have created it. Please provide the CSS. Thanks.

This should be the CSS:

body .inside-page-hero.grid-container {
    max-width: 1020px;
}

You will want to wrap the template tag with <h1> like this:
<h1>{{post_title}}</h1>

thanks works perfectly. But how to reduce padding below the title and date and author.

Thank you.. you have been very helpful. Appreciate it.

This archived topic is closed to new replies.