Custom Page/Post backgrounds

Community Forums Forums Design Tips and Tricks Custom Page/Post backgrounds

This topic is: resolved

Tagged: ,

This topic contains 2 replies, has 2 voices, and was last updated by  john scheine 1 year, 6 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #47191

    john scheine
    Participant
    Post count: 7

    This is what I am trying to accomplish, without adding any additional Plugins:

    I would like my blog post background colors to be different then my page background colors. (We are not talking about the content area as i’ve already used css on individual pages to make them black while posts are white background in the content area)

    Here is an example of a blog page: http://www.longislandmarketingcompany.com/10-examples-brand-facebook-covers/
    Here is a page example: http://www.longislandmarketingcompany.com/about-long-island-marketing-company/

    This is the css portion of the code used to change the content area background on individual pages. (required additional code added to php) Posts are not controlled by individual coding.

    /* Change Content Area Background Color – Post or Page */

    body.page-id-95 #content {
    background: #000;
    }

    body.page-id-39 #content {
    background: #000;
    }

    Note: This is done for all pages. (would be redundant to paste all of it)

    How do I accomplish the same thing through css/php but for the page backgrounds on individual pages?
    Thank you for your help. Hopefully I’m being clear on what I am trying to accomplish.

    http://www.longislandmarketingcompany.com/
    #47211

    Chris Cree
    Participant
    Post count: 147

    You don’t have to list each page by ID number. You can just use one entry:

    body.page #content {
    background: #000;
    }

    and it would cover all pages. That way you don’t have to keep updating your stylesheet every time you add a new page.

    Which div are do you want to change the background color for?

    If it is the body div then you can do something like this:

    body.page {
    background: #f00;
    }
    
    body.single {
    background: #00f;
    }
    

    Since you have a custom background color you may need to add that class to the selector. For example:

    body.page.custom-background {
    background: #f00;
    }

    #47239

    john scheine
    Participant
    Post count: 7

    Thank you. I should of came here first, google search ended up making me do more work then necessary. The last one did the trick.

Viewing 3 posts - 1 through 3 (of 3 total)

The topic ‘Custom Page/Post backgrounds’ is closed to new replies.