A user wants to change the background color of collection pages in the Debut theme without affecting the header background, which currently changes together when modified in Settings.
Solution provided:
div#shopify-section-collection-template with the desired background color</body> tagRemaining issue:
#shopify-section-collection-template.header was provided to make the entire header area (where “Products” appears) match the same background colorStatus: Partially resolved - main functionality working, with final styling adjustments being implemented.
Hello,
I would like to change the background color of the body of my Collection pages - if I go to change it in Settings it changes the Header background too which I do not want
Store: https://vanislandwhale.myshopify.com/
Page in question: https://vanislandwhale.myshopify.com/collections/all
Thank you!
Hi @VanIslandWhale , Go to theme.css and add the following code:
div#shopify-section-collection-template {
background-color: #010101 !important;
}
Thank you!
Glad I helped, feel free to contact me if you need any help.
Ok I found a new issue. When I add it to Theme.css and save it, it is not visible on my site. If I add it to the custom CSS box under Theme Settings I can see it, but I cannot save it.
It also appears to be changing part of my Header - note the sand color on either edge of Products.
I am adding he code as follows:
div#shopify-section-collection-template {
background-color: #d4cbb0 !important;
}
@VanIslandWhale , try to added to the theme.liquid at the bottom above the tag like this :
Ok perfect it is now visible! The only issue now is the orange does not extend all the way across the top as seen here:
https://vanislandwhale.myshopify.com/collections/all
I’d like the whole area where it says “Products” to be the same color if possible
@VanIslandWhale , add this to the previous code :
#shopify-section-collection-template .section-header {
background-color:#d4cbb0 !important;
}