Changing the background colour of single page

  • Resolved palloran

    (@palloran)


    8 years, 7 months ago

    Hi,

    I know it sounds very basic but even following other forum answers it doesnt seem to work.
    I just need to change the background colour of a single page , white to grey.
    but even though I tried :

    .postid-1488 {
    background-color: #d6d6d6;
    }

    Does not seem to work, I am not sure if I am putting this code in the right place, I have tried at the bottom of the style.css, as well as under
    <body <?php body_class(); ?>> in the the header.css

    Please any help would be appreciated. I am very new to wordpress and have inherited a website from a previous colleague so its a bit pain staking reverse engineering the website.

    Thanks

    Paul

Viewing 15 replies - 1 through 15 (of 18 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    please post a link to your site. The CSS would requires seem your page’s markup.

    View the source of the page you want to change. Your browser will allow you to do that. It’s ctrl+U in Chrome.

    Near the top of the page look for the <body> tag.

    On one of my sites it looks like this:

    <body class="home page page-id-4 page-template page-template-splash-page page-template-splash-page-php page-home">

    So if I add body.page-id-4 as the prefix to a CSS rule it will only target that page as that is the first part of the selector.

    It maybe that your selector is missing a hyphen?

    .post-id-1488 {
background-color: #d6d6d6;
}
    Thread Starter palloran

    (@palloran)

    Hi Steve,

    Really appreciate your time, the site is

    https://www.onefruitdysonrentals.co.uk/am09/

    page- Am09

    [moderated: expanded bit.ly link]

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    I think this will work

    body.post-id-1488 {
   background-color: #d6d6d6;
}

    .post-id-xxx by itself does not identify any part of the page.

    Thread Starter palloran

    (@palloran)

    Hi Marc,

    where have i missed the hyphen?

    I found where to look via chrome:

    #main {
    padding: 55px 10px 45px;
    background: #fff;
    overflow: hidden !important;
    clear: both;
    }

    but where do I edit this ?

    Many thanks guys

    Paul

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    try

    #main.post-id-1488 {
   background-color: #d6d6d6;
}

    or

    .post-id-1488 #main  {
   background-color: #d6d6d6;
}

    It’s going to be something like that.

    Thread Starter palloran

    (@palloran)

    Hi steve
    Ive tried both at the end of the style.css

    both did nothing, have I got it in the wrong place ?

    Thanks

    Should be .page-id-.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    Jacob: Right! .page-id-xxxx My bad for not catching that.

    Thread Starter palloran

    (@palloran)

    Hi

    Again not sounding stupid , but this is all to be entered at the bottom of style.css correct ?

    If so none work

    Thanks for your time,

    Paul

    Thread Starter palloran

    (@palloran)

    Ok so I add this to the custom css :D.

    Many thanks for all your time !

    Hi,

    I have tried both adding following code to both custom css and style.css file but nothing has worked.

    #main.page-id-139 {
    background-color: #2b302c;
    }

    .page-id-139 #main {
    background-color: #2b302c;
    }

    Is there another way to change background page colour of just one page?

    link: https://demo.madabouthair.com.au/bookonline/

    All good i just had to put body.page-id-139!!

    Works fine now

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    majority: please start a new thread for your issue.

    Hi Guys

    Very new to wordpress and find it a bit difficult to come to grips with , however I refuse to give up on it as I heard its very powerful tool.

    I am currently trying to change a page color when I inspect the element i get

    <body class=”page-template-default page page-id-27 custom-background siteScrolled

    I have seen on previous posts that all you have to do is insert

    #main.page-id-27 {
    background-color: #d6d6d6;
    }

    and it will change , however i cannot get it right , do you enter at the end of the css?

    Any assistance would be appreciated.

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Changing the background colour of single page’ is closed to new replies.