Change add to cart color

Hello !

Is it possible to have a unique color of the “add to cart” button on a product page.

for example I am selling a RED product, I want the “add to cart” button to be red, another product page with a different product which is blue, how to have the “add to cart” button in blue please ?

Beautiful day

Hello,

Sorry to say but there isn’t a direct option available for that. If you want to change the global Add to Cart button color change then you can go to Dashboard > Theme Settings > Styles and colors > Buttons > Advanced button styles > in that you can select Single add to cart > and then select the Colors accordingly: https://ibb.co/3NnQ9MV

Regarding your specific colors for Add to Cart button concern, a CSS solution can be possible but that wouldn’t be suggested as a good solution if you have a lot of Products on your Site. In that CSS solution, you can take that specific Product Page ID and use it with the Add to Cart button class and then define specific color through CSS color property.

Best Regards

Hey hello and thank you for your answer can you please help me to the css solution ?
I just need the hover change in PINK color in the product in “extra informations” i just have 3 products in my shop.

I hope you will have time to answer me that would be great!

Best regards

Hello,

Please try using the below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> Global CSS section.

If you want to change the Hover Color of the Add to Cart button for main Single Product page then please try the following one:

.single_add_to_cart_button:hover {
    background: pink !important;
}

If you want to change the Hover Color of the Add to Cart button for Similar Products at the bottom of the Single Product page then please try the following one:

.wd-hover-quick .wd-add-btn>a:hover {
    background-color: pink !important;
}

Hope this helps !

Best Regards

Perfect thnx, you can close the topic.

god bless

Most Welcome!!!.

I’m so happy to hear you are pleased with the Theme and Support. XTEMOS strives to deliver the best customer experience, and it makes our day to hear we have accomplished that.

We count ourselves lucky to have you as a customer. You can always reach us at any time. We are always here to help you.

Thanks for contacting us.
Have a great day.

Topic Closed.
Best Regards.

[Author]

Posts