0

I am trying to customise the background colour of my site. It's a 2011 Child Theme. When I go to Appearance -> Customize -> Colors, I get the Light and Dark option under Color Scheme, but can't completely customise it. No custom colour option is available except as listed for Header Text / Background and Link colours, where I can use the slider.

I have selected the Dark option but the background isn't truly black, would like to make it darker, been searching and can't find a way to make it work / edit it etc. Tried in the theme editor as well.

Any ideas would be greatly appreciated. Thanx in advance!

Improve this question
3
  • Can you provide a link and a description of the element you're trying to make darker? – ralphjsmit Jul 6 '20 at 7:50
  • www.deserthighways.com Main body section behind text. Although have just been suggested I leave it so that black images posted on it stand out, so have done the sides same to match. – Anthony Moore Jul 6 '20 at 8:09
  • Also can't seem to change the footer colour to match. I have changed part of the section in the middle widdle, but not the overall footer colour, any ideas please? – Anthony Moore Jul 6 '20 at 9:36
0

Background-color:

body.custom-background {
        background-color: #0f0f0f; /* Color for the two borders */
}

#page {
    background: #0f0f0f; /* Color for the content/body part in the center */
}

#site-generator {
    background: #0f0f0f; /* Color for the footer part in the center */
}

You can also take it together into one snippet that changes the color of all three:

body.custom-background, #page, #site-generator { background: #0f0f0f; }

Your page background is kind of 'split' in two parts. Two borders at the left and right side and the center part.

This situation is the same in the footer. You can change the color of the middle section (like you did), but not the border color. The first part (body.custom-background) is about the border and applies to both the border besides the content and besides the footer. So if everything should be black, applying the above code is enough. You can put it in Customizer > Additional CSS.

I now chose for the color #0f0f0f, because that is the current background color. If you want pitch-black, choose #000000.

Let me know how it does!

Improve this answer
2
  • Thank you. That is awesome. If I want to change the footer color to match the rest instead, do you know how to do that? – Anthony Moore Jul 9 '20 at 1:01
  • I added the part for the footer, #site-generator and changed the color. In addition to that, I also created a combined code part so that you can change it all with one piece of code. The color #0f0f0f should be the correct color. – ralphjsmit Jul 9 '20 at 11:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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