Shopify themes, liquid, logos, and UX
Hi, I want to change the overlay color of the title area on my collection pages, but not change the overlay on the collection grid on the home page.
I was able to accomplish this for the home page overlay with this
div#shopify-section-hero-1 .hero__overlay::before {
background-color: #416b52;
opacity: .9;
}
But can't figure out the collection listing page.
I have tried these in theme.css -
div#shopify-section-collection-template .hero__overlay::before {
background-color: #416b52;
opacity: .9;
}
div#Hero-hero-1 .hero__overlay::before {
background-color: #416b52;
opacity: .9;
}
div#collection-hero .hero__overlay::before {
background-color: #416b52;
opacity: .9;
}
div#collection-template .hero__overlay::before {
background-color: #416b52;
opacity: .9;
}
https://fat-beet-farm-kitchen-bakery.myshopify.com/collections/full-meals
password - aurtau
thank you!
Solved! Go to the solution
This is an accepted solution.
yes please add this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
.collection-hero__title-wrapper::before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: #416b52;
opacity: .9;
}
please confirm this ok?
Yes, I'll make it green but that's the color overlay i want to change.
This is an accepted solution.
yes please add this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
.collection-hero__title-wrapper::before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: #416b52;
opacity: .9;
}
That worked perfectly, thank you!
its my pleasure to help us
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024