Shopify themes, liquid, logos, and UX
Hi,
I'm trying to change the background color of my announcement and e-mail sign-up bars. I tried doing this in the theme settings by selecting the inverse color but it keeps changing the color of my fonts. I hope there is a way I can set the colors for the background without having any effect on my font colors.
My site: urbanpawpets.com
Solved! Go to the solution
This is an accepted solution.
Hello @orrabie
It's GemPages support team and glad to support you today.
You can follow these steps:
1. Go to Online Store -> Theme -> Edit code
2. Open your base.css file and paste the following code below:
#shopify-section-announcement-bar .gradient{
background: #ff9a01;
}
Let us know how it works for you.
Best regards,
GemPages Support Team
This is an accepted solution.
@orrabie
add this css
input#NewsletterForm--template--17277858054427__57bbe6a6-e0c9-4003-b70a-12d7b4dda461 {
background: red;
}
Hallo @orrabie
You can add code by following these steps to change
1. Go to Online Store -> Theme -> Edit code > assets > base.css
paste below code at bottom(base.css)
.announcement-bar.color-inverse.gradient {
background: red;
}
If you require any further information, feel free to contact me.
Best regards,
This is an accepted solution.
Hello @orrabie
It's GemPages support team and glad to support you today.
You can follow these steps:
1. Go to Online Store -> Theme -> Edit code
2. Open your base.css file and paste the following code below:
#shopify-section-announcement-bar .gradient{
background: #ff9a01;
}
Let us know how it works for you.
Best regards,
GemPages Support Team
add this css
.newsletter__wrapper.color-inverse.gradient.content-container.isolate.content-container--full-width.section-template--17277858054427__57bbe6a6-e0c9-4003-b70a-12d7b4dda461-padding {
background: red;
}
please like and accept solution
Hi,
It did work out, but the email capture bar is still in black. I have attached a capture for reference.
This is an accepted solution.
@orrabie
add this css
input#NewsletterForm--template--17277858054427__57bbe6a6-e0c9-4003-b70a-12d7b4dda461 {
background: red;
}
Thanks for your help guys, it worked out!
Hi @orrabie
You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag </body>
<style>
#shopify-section-announcement-bar .gradient{
background: #ff9a01;
}
.newsletter__wrapper.color-inverse.gradient.content-container.isolate.content-container--full-width.section-template--17277858054427__57bbe6a6-e0c9-4003-b70a-12d7b4dda461-padding {
background: #ff9a01;
}
</style>
Hope this answer helps.
Best regards,
Victor | PageFly
Hi,
I did add it to the base.css and it worked out. Thanks for your help.
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024