Colour background for photo overlay

Solved
SazAndSew
New Member
4 0 0

I want to add a background colour to my text overlay for my photo and collections on my home page to make the text stand out more.

BDA4CE8D-DA7D-427A-9C93-BD1ACB0C1D40.jpeg

DB51C9B4-D439-42C0-B03E-3F6D1B14099E.jpeg

Is this possible?

The backing colour I would like is the same as the home page background which is #F7F8F5 with black text. 

My store is www.sazandsew.co.uk 

 

Thanks in advance!

0 Likes
Natztech
Shopify Partner
846 230 627

This is an accepted solution.

please Go to Online Store->Theme->Edit code then  Asset->/theme.css ->paste below code at the bottom of the file.

 

#shopify-section-hero-1 .hero  .hero__inner .text-center h2.mega-title{
   color: #000000 !important;
    background-color: #F7F8F5 !important;
    opacity: 0.8 !important;
}


#shopify-section-1591555059023  .collection-grid .grid .grid__item .collection-grid-item .collection-grid-item__link .collection-grid-item__title-wrapper  .h3 {
   color: #000000 !important;
    background-color: #F7F8F5 !important;
    opacity: 0.8 !important;

}

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
SazAndSew
New Member
4 0 0

Thanks so much for that! It’s changed the main photo and the first lot of collection photos, just not the second lot. 

where can I find the Shopify section number to duplicate the code? 

image.jpg

thanks 

 

0 Likes
Natztech
Shopify Partner
846 230 627

This is an accepted solution.

insert this code

#shopify-section-1601214431765 .collection-grid .grid .grid__item .collection-grid-item .collection-grid-item__link .collection-grid-item__title-wrapper .h3 
{ color: #000000 !important; 
 background-color: #F7F8F5 !important;
 opacity: 0.8 !important; }

 

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
SazAndSew
New Member
4 0 0

perfect, thanks so much for your help!!

0 Likes