Re: Change color of text and buttons of product information page on Dawn theme

Change color of text and buttons of product information page on Dawn theme

constantinwp
Tourist
9 0 1

Hey! I've been trying to change the text & button colors of product information page to make it match the rest of my store, but I can't seem to find the answer. 

Here's the link https://fibrabuena.cl/products/camisa-brotherhood

 

As you can see, the product title, buy button, etc, is following the original colors and the side menu doesn't offer the option to select color scheme. 

Replies 8 (8)

Abdosamer
Shopify Partner
895 163 183

@constantinwp , what parts do you want to change its color?

Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
My work
constantinwp
Tourist
9 0 1

Captura de Pantalla 2023-11-22 a la(s) 23.15.50.png

ZenoPageBuilder
Shopify Partner
1052 203 225

Hello @constantinwp 👋

To change the product page's title and button, in Shopify Admin, go to Edit theme code, open file base.css and add this code at the bottom

.product__title h1 {
    color: #FF0000;
}

.shopify-payment-button__button {
    background-color: #FF0000;
}

The result

Screenshot 2023-11-23 at 09.51.21.png

Make sure to change the color value as you need.

Zeno Page Builder - Build responsive & SEO-optimized Landing pages, Blog posts, Product pages and more...
Learn more at zenobuilder.com
constantinwp
Tourist
9 0 1

Thank you! And how do I change the remaining items that keep being black on your picture? I would like to change them all

ZenoPageBuilder
Shopify Partner
1052 203 225

There are several items in the picture. Can you tell exactly what you want to change?

Changing them all is not a good idea.

Zeno Page Builder - Build responsive & SEO-optimized Landing pages, Blog posts, Product pages and more...
Learn more at zenobuilder.com

PageFly-Oliver
Shopify Partner
878 190 181

Hi @constantinwp ,

 

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>
#MainContent product-info{
--color-foreground: 73,71,55;
}
</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.

constantinwp
Tourist
9 0 1

Hey! It works on some elementsCaptura de Pantalla 2023-11-23 a la(s) 08.43.51.png, but the buy button is still black 

PageFly-Oliver
Shopify Partner
878 190 181

you can try

 

<style>
#MainContent product-info{
--color-foreground: 73,71,55;
--color-button-text: 73,71,55;
}
</style>

 

 

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.