Solved

Changing heading colour in home page banner, without affecting heading colour on other pages

nankeen
Visitor
1 0 0

Hi there,

 

I am using the Dawn theme

 

Website is 8e984b-38.myshopify.com

 

I previously had issue of the text in pages being the same color as the headings, I used some code to change this such that headings are now light blue, and main body text is dark blue. This was done by the following code in base.css

 

}
h2 {
color: #63e2ed !important;
}
h1 {
color: #63e2ed !important;
}

 

However the issue I'm having now is I would like the home page banner heading to be in white, but it is now the same colour as all the other headings (which I would like to keep as light blue). I tried the below code in theme.liquid before </body> but it did not work.

 

<style>

h2.banner__heading.h1 {

color: #FFFFFF !important;

}

.banner__text.subtitle {

color: #FFFFFF !important;

}

</style>

 

Any help would be appreciated, thanks

 

Accepted Solution (1)

Dan-From-Ryviu
Shopify Partner
7538 1454 1452

This is an accepted solution.

Please add this code to Custom CSS of that banner section in your Online Store > Themes > Customize 

h2.banner__heading {
color: #FFFFFF !important;
}

Screenshot 2024-03-21 at 09.58.04.png

 

- Helpful? Like or Accept solution! - Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 5 (5)

Dan-From-Ryviu
Shopify Partner
7538 1454 1452

This is an accepted solution.

Please add this code to Custom CSS of that banner section in your Online Store > Themes > Customize 

h2.banner__heading {
color: #FFFFFF !important;
}

Screenshot 2024-03-21 at 09.58.04.png

 

- Helpful? Like or Accept solution! - Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

PageFly-Oliver
Astronaut
840 176 157

Hi @nankeen ,

 

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file -> Save

 

 

<style>
h2.banner__heading {
color: white !important;
}
</style>

 

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

LuffyOnePiece
Shopify Partner
332 58 57

Hi @nankeen  ,

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find base.css file
4) Add the following code at the end of the file

section#shopify-section-template--16659185467592__image_banner h2.banner__heading.inline-richtext.h0 {
    color: #fff !important;
}


If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!


Best Regards,
Sandeep 

Sandeep Pangeni
Need help with your store? sandeeppangeni17@gmail.com
For quick response, Contact In WhatsApp +9779867521184

techlyser_web
Shopify Partner
1423 268 282

Hello @nankeen 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
 .banner__box h2.banner__heading.inline-richtext.h0 strong {
    color: #fff !important;
 }
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

websensepro
Shopify Partner
1014 139 147

Hello @nankeen ,

Try this code,

Go to online store > themes > edit code > Base.css file

Add this code at the bottom base.css file

.banner__heading inline-richtext h0{
color: #FFFFFF;
}

save changes .

 

Need a Shopify developer?
Hire us at WebSensePro
For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
Subscribe to our youtube channel or buy us a Cofee here