Changing Add to cart & Buy it now button color & text

Solved

Changing Add to cart & Buy it now button color & text

Dike
Pathfinder
105 1 41

Hello everyone,

I'm trying to change the color of my add to cart & buy it now buttons and their text.

Dike_0-1636299210341.png

 



This is what they look like now.

I want the top one (add to cart) to be #FFFFFF, with #F3896F outlining and text.

The bottom one (buy it now) to be #F3896F, outlinig #F3896F with #FFFFFF text.

Any help is greatly appreciated!

Thank you.

URL: https://glowee.nl/

Accepted Solution (1)

Guleria
Shopify Partner
3236 630 906

This is an accepted solution.

Hello @Dike ,

 

1. Go to Online Store->Theme->Edit code
2. Asset->section-main-product.css  paste bellow code in bottom of file

.product-form__submit span {
    color: #F3896F;
}
.product-form__submit {
    border: solid 1px #F3896F !important;
    box-shadow: none;
}
.product-form__submit:hover {
    box-shadow: none !important;
}
.shopify-payment-button__button--unbranded {
    background: #F3896F !important;
    color: #FFFFFF !important;
    box-shadow: none !important;
}

 

Thanks

- If helpful then please Like and Accept Solution.
- Want to modify or custom changes or bug fix on store Hire me. - Email: guleriathakur43@gmail.com - Skype: navrocks1 ,
- Try GEMPAGES a great page builder
- Support me PayPal

View solution in original post

Replies 2 (2)

Guleria
Shopify Partner
3236 630 906

This is an accepted solution.

Hello @Dike ,

 

1. Go to Online Store->Theme->Edit code
2. Asset->section-main-product.css  paste bellow code in bottom of file

.product-form__submit span {
    color: #F3896F;
}
.product-form__submit {
    border: solid 1px #F3896F !important;
    box-shadow: none;
}
.product-form__submit:hover {
    box-shadow: none !important;
}
.shopify-payment-button__button--unbranded {
    background: #F3896F !important;
    color: #FFFFFF !important;
    box-shadow: none !important;
}

 

Thanks

- If helpful then please Like and Accept Solution.
- Want to modify or custom changes or bug fix on store Hire me. - Email: guleriathakur43@gmail.com - Skype: navrocks1 ,
- Try GEMPAGES a great page builder
- Support me PayPal
Dike
Pathfinder
105 1 41

This worked perfectly, thank you so much!