storefront remove background image on one page

@christianne806,

It looks like where you’re going wrong here is the first dots. Body is not a class, it is an HTML element. As such you should target body.page-id-253 rather than .body.page-id-253.

I am most happy to report that 3 out of 4 pages where I want no background image are now wonderfully blank (250, 253, 1072). However, 155 (Shop) still has the background image. I tried putting it in separately, and it still has the image. I am most grateful for your guidance.

body.page-id-155,
body.page-id-250,
body.page-id-253,
body.page-id-1072
{
background-image: none !important;
background-color: #FFFF;
}

@christianne806,

That’s because the Shop page doesn’t have any such Page ID class.

You should target this instead – body.post-type-archive-product

That works! And thank you for explaining why. I need to go a bit further on this to make all the Shop pages have blank backgrounds that are accessed from the sidebar Category Search on the Shop Page. The background image is still there on those shopping pages. I tried body.post-type-archive-product-categories, but once again this is something above my level of understanding. And I am grateful for yours and your quick replies.

@christianne806,

You’ll want to use the inspector tool in Google Chrome to figure out what classes you need to target and text your CSS before implementing it.

Here’s a tutorial that shows you how to use it – https://developers.google.com/web/tools/chrome-devtools/inspect-styles/.

It’s exactly what I’ve used to figure out the correct elements and classes you need to target in my previous replies.

Finally, Sir Luminus, the light bulb went off in my head because you have supplied the electricity! Thank you so much for hanging in there with me. We can now mark our conversations as “resolved”! God bless you, sir!