Buy button background Color Change

[raja18181]

> > Hey there, I want to change background Color of “Buy it now” button to black Color. Please help me.

[BSSCommerce-B2B]

Hi,
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

[raja18181]

www.azadifit.com

[raja18181]

I’m waiting for you???

[niraj_patel]

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 on theme.liquid

.BUz42FHpSPncCPJ4Pr_f { background: #3cdbdb !important; } .BUz42FHpSPncCPJ4Pr_f:before, .BUz42FHpSPncCPJ4Pr_f:after{ box-shadow: unset !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[raja18181]

I want to add black colour

[niraj_patel]

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 on theme.liquid

.BUz42FHpSPncCPJ4Pr_f { background: #000 !important; color: #fff !important; } .BUz42FHpSPncCPJ4Pr_f:before, .BUz42FHpSPncCPJ4Pr_f:after{ box-shadow: unset !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[raja18181]

Send me the code only

[niraj_patel]

1. Go to Online Store → Theme → Edit code.

2. Open your theme.liquid file

3. Paste the below code before on theme.liquid

.BUz42FHpSPncCPJ4Pr_f { background: #000 !important; color: #fff !important; } .BUz42FHpSPncCPJ4Pr_f:before, .BUz42FHpSPncCPJ4Pr_f:after{ box-shadow: unset !important; }

[BSSCommerce-B2B]

Step 1. Go to Admin → Online store → Theme > Edit code

Step 2. Find the main css file theme.css (or base.css,…) . Search for the following CSS snippet
Step 3. Copy this code at the end of the file

.product-form__buttons .shopify-payment-button__button,
.shopify-payment-button__button--unbranded:hover, 
.shopify-payment-button__button--unbranded:hover:not([disabled]) {
    background-color: black!important;
    color: white!important;
}
.product-form__buttons .shopify-payment-button__button:after,
.product-form__buttons .shopify-payment-button__button:before {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)!important;
}

You will get the result like this

If it helps you, please like and mark it as the solution.

Best Regards

[raja18181]

Not working

[BSSCommerce-B2B]

Did you paste the code like this?

[raja18181]

Yes, It changes the buy button Color when I move cursor on that button. When I move the cursor it becomes yellow

[BSSCommerce-B2B]

try add this to theme.liquid file again please

[raja18181]

Not working. Thanks! I’ll ask someone else