WooCommerce Product Page Background Colour

harisqei · October 2016

Hi Guys

Just wanting to change the background colour on my product pages as currently it's not visible due to the main background image.

How can I do this?

I notice this CSS on your demo page

"#Wrapper, #Content {

background-color:

#FCFCFC;

}"

I tried to edit that to only apply to the woocommerce product pages by using this CSS which doesn't seem to work either
".product #Content { background-color: #fff !important; }"

Any ideas? This is the product page - https://employmentinnovations.com/product/employment-basics-pack/

Thanks!

Albert · October 2016

Hi,

to set background color of single product pages, you need to use the following css:

.single-product #Wrapper, .single-product #Content { background: #FFF !important; }

harisqei · October 2016

Thanks guys - only problem is now that the entire page background is white.

Is there any way to only make the wrapper white, as this makes the header, logo and background image not visible

Albert · October 2016

If you want just wrapper to be white, remove .single-product #Content part from above css.

harisqei · October 2016

I tried that and it didn't work, but I tried the other way around it worked for some reason.

In case anyone else is trying to do the same, the end CSS was:

.single-product #Content { background: #FFF !important; }

Thanks for great support guys - always quick to respond!

Albert · October 2016

No problem!

WooCommerce Product Page Background Colour

Comments