Add-to-cart button color change before selecting options on variable product pag


#1

Hello,

Since the last update of the theme the color for the add-to-cart button changed to purple, when it is still disabled before selecting options on a variable product page. I tried everywhere to change the color, but I did not succeed. Do you know where to change it?

An example here:
teszt.meszkoplaza.hu/termek/tardosi-marvanymintas-lepcso-homloklap/

Thanks is advance.

Kind regards,
Liana


#2

Hi,

The button is purple, because it’s disabled until you select the product variations, after that the button will turn into a clickable button with the default style, but if you want to change it’s color you can do it with this Custom CSS:

.woocommerce #respond input#submit.alt.disabled, .woocommerce #respond input#submit.alt.disabled:hover, .woocommerce #respond input#submit.alt:disabled, .woocommerce #respond input#submit.alt:disabled:hover, .woocommerce #respond input#submit.alt:disabled[disabled], .woocommerce #respond input#submit.alt:disabled[disabled]:hover, .woocommerce a.button.alt.disabled, .woocommerce a.button.alt.disabled:hover, .woocommerce a.button.alt:disabled, .woocommerce a.button.alt:disabled:hover, .woocommerce a.button.alt:disabled[disabled], .woocommerce a.button.alt:disabled[disabled]:hover, .woocommerce button.button.alt.disabled, .woocommerce button.button.alt.disabled:hover, .woocommerce button.button.alt:disabled, .woocommerce button.button.alt:disabled:hover, .woocommerce button.button.alt:disabled[disabled], .woocommerce button.button.alt:disabled[disabled]:hover, .woocommerce input.button.alt.disabled, .woocommerce input.button.alt.disabled:hover, .woocommerce input.button.alt:disabled, .woocommerce input.button.alt:disabled:hover, .woocommerce input.button.alt:disabled[disabled], .woocommerce input.button.alt:disabled[disabled]:hover {
    background-color: red;
    opacity: 0.7;
    color: #fff;
}

Add the above CSS to your Child Theme’s style.css or in case you haven’t setup a Child Theme already, then you can also use this plugin to add the CSS to it: https://wordpress.org/plugins/simple-custom-css/ so you will not loose the changes on theme updates.

Please let me know how it works.

Best Regards,
Csaba