Buy Buttons CSS

how can I change the background colors, borders colors, font colors and the loading image on the buy buttons (also on hover state)

Hello,

In general, you can customize all buttons on the website globally via Theme Settings -> Style & Colors -> Buttons.
Loading icon is not an image and is made with CSS code so you can’t simply replace it with your image icon.

Regards

How can I change the color of the cart icon that appear on hover? And How I change the loading icon inside the button?

Could you please provide us a screenshot what color do you want to change?

As we said, loading icon is not an image and is made with CSS code so you can’t simply replace it with your image icon.

The background is transparent. I need to change de colors of the icons inside the button. (CSS classes)

https://drive.google.com/file/d/1hICiu-YxoY8OtBXkwFXsVrV0-A1y-CDL/view?usp=sharing

Use this CSS code

div.woodmart-hover-standard .btn-add>a:before {
	color: black;
}

Thank you. Now i need the code for the loading icon.

How do you want to change the loading icon?

Change the color.

Try this snippet

div.woodmart-hover-standard .btn-add>a:after {
	border-color: rgba(0,0,0,0.4);
	border-left-color: rgba(0,0,0,1);
}

Thanks!

This code:

div.woodmart-hover-standard .btn-add>a:after {
border-color: rgba(0,0,0,0.4);
border-left-color: rgba(0,0,0,1);
}

Worked for products grid on shop page but in the product page the loading icon (inside the button) is not appearing when i click on buy button

Use this also

button.loading.single_add_to_cart_button:after {
border-color: rgba(0,0,0,0.4);
border-left-color: rgba(0,0,0,1);
}

[Author]

Posts