change the product page Add To Cart button background without affecting the other buttons

orhl1234
Shopify Partner
47 0 0

I managed to change the add to cart button but it affected all add to cart buttons on my store.

how can I solve that?

Replies 5 (5)

AnneLuo
Shopify Partner
232 45 51

Hi, @orhl1234 

Can you share your store url?

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email me

techlyser_web
Shopify Partner
1423 268 282

Hello @orhl1234 

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>
  .product-form__buttons .button.product-form__submit {
       background: blue !important; /*change color according to you*/
  }
</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
orhl1234
Shopify Partner
47 0 0

its working but is that fine?

orhl1234_0-1712068427219.png

 

techlyser_web
Shopify Partner
1423 268 282

Yes, but when you add background white then you have to change the button text color also.
.product-form__buttons .button.product-form__submit {
      color: #000 !important;
  }

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

Raj-webdesigner
Shopify Partner
236 52 53

Add This Css in your open Edit code > base.css File

product-form.product-form .product-form__submit{
    background: #000;
    color: #fff;
}
If you require further help to optimize your store, please don’t hesitate to reach out.

This contribution will always benefit you and you will get my full help easily and you can contact me easily.
Your Willpower Contribution Link :-

Contribution



Contect On My Mail :-raj.s.webdevloper@gmail.com