Re: Set font colour of image banner heading text

Solved

Set font colour of image banner heading text

OliviaMichaelCo
Pathfinder
126 10 28

Hello all.

 

I'm quite new to Shopify and while the FAQs and help pages here have been of tremendous use, I cannot quite find the answer to a problem I have with font colours.

 

I have an image banner on a few pages and unlike when you have a text box behind the header text, the font doesn't change colour based on the background image. It defaults to a white font, which makes it hard to read since most of my images are lighter in nature.

 

Is there a way to customise the font colour for a specific image banner and change it from white to black?

 

Note, not all image banners have this issue, so I'd like to just target those where I have used a lighter image.

 

Many thanks.

Rosalind.

Accepted Solution (1)
OliviaMichaelCo
Pathfinder
126 10 28

This is an accepted solution.

Hello Ketan,

 

Thank you for the offer to help. I actually found this shortly after posting. I had to find the relevant theme file and add it manually there.

 

I found this:

 

.banner__heading > *,
.banner__text > * {
word-wrap: break-word;
color: white !important;
}

 

Within the section-image-banner.css file and changed 'white' to 'black', as it happens, I don't like it black so leaving it as the theme intended. 

Thank you.

View solution in original post

Replies 2 (2)

KetanKumar
Shopify Partner
37509 3664 12135

@OliviaMichaelCo 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
OliviaMichaelCo
Pathfinder
126 10 28

This is an accepted solution.

Hello Ketan,

 

Thank you for the offer to help. I actually found this shortly after posting. I had to find the relevant theme file and add it manually there.

 

I found this:

 

.banner__heading > *,
.banner__text > * {
word-wrap: break-word;
color: white !important;
}

 

Within the section-image-banner.css file and changed 'white' to 'black', as it happens, I don't like it black so leaving it as the theme intended. 

Thank you.