Shopify themes, liquid, logos, and UX
Hi,
Does anyone know how to change the colour of the title and body text for the email subscription section and collection list section using codes that can be pasted at the bottom of the base.css file? We want the titles to be #177F67 and the body text to be #000000 for both sections.
We are using the Dawn theme. Unfortunately I cannot share the URL because the site isn't published yet.
Thanks!
Solved! Go to the solution
This is an accepted solution.
This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/base.css->paste below code at the bottom of the file:
.newsletter__wrapper h2,
.collection-list-wrapper h2 {
color: #177F67 !important;
}
.newsletter__subheading p {
color: #000 !important;
}
I hope it would help you
Best regards,
Kate | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
➜ Unlock the secrets to a record-breaking BFCM with PageFly and Canva
➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)
➜ Weekly updated Shopify tutorials on YouTube
All features are available from the Free plan. Live Chat Support is available 24/7.
Hello @strokefdn
It's GemPages support team and glad to support you today.
Please add code below to the bottom of the base.css file
#MainContent .collection .collection__title h2,
#shopify-section-footer .footer-block__newsletter .footer-block__heading{
color: #177F67;
}
#MainContent .collection > slider-component .product-grid .product-card-wrapper .card__information .card__heading .full-unstyled-link,
#MainContent .collection > slider-component .product-grid .product-card-wrapper .card__badge .badge,
#MainContent .collection > slider-component .product-grid .product-card-wrapper .card__information .price__container,
#MainContent .collection > slider-component .product-grid .product-card-wrapper .card__information .price--on-sale .price-item--regular,
#shopify-section-footer .newsletter-form__field-wrapper .field__input,
#shopify-section-footer .newsletter-form__field-wrapper .field__label{
color: #000000;
}
Result
I hope the above is useful to you.
Kind & Best regards,
GemPages Support Team
Didn't work unfortunately
h2 {
color: #1C256A !important;
}
this code works but then it changes the heading colours in the footer. Is there any way to stop this happening so all the text in the footer stays white?
Hi @strokefdn
You can use the following code:
.footer-block--newsletter .footer-block__heading {
color: #1C256A !important;
}
.collection .title.h2 {
color: #1C256A !important;
}
I hope that it will work for you.
If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here ☕.
B2B Solution & Custom Pricing | Product Labels by BSS
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
No luck with this one either.
To confirm, these are the sections we need changed
This is an accepted solution.
This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/base.css->paste below code at the bottom of the file:
.newsletter__wrapper h2,
.collection-list-wrapper h2 {
color: #177F67 !important;
}
.newsletter__subheading p {
color: #000 !important;
}
I hope it would help you
Best regards,
Kate | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
➜ Unlock the secrets to a record-breaking BFCM with PageFly and Canva
➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)
➜ Weekly updated Shopify tutorials on YouTube
All features are available from the Free plan. Live Chat Support is available 24/7.
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025