Home › Forums › WoodMart support forum › Gray out add to cart when variations need to be selected

Gray out add to cart when variations need to be selected

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • March 13, 2021 at 1:09 pm #273291

    Lexp
    Participant

    Hi,

    I have products with variations, at this moment when a customer doesn’t choose a variation but clicks on the add to cart a (ugly) notification appears.
    How can i make the button either gray out or make it not clickable until a variation is selected?

    March 13, 2021 at 5:39 pm #273312

    Elise Noromit
    Member

    Hello,

    Thank you very much for choosing our theme and for contacting us.

    Unfortunately, Woocommerce does not provide the option. If a variable product is based on more than two attributes, both should be selected to add a product to a cart. Otherwise, create the variation basing on one attribute.

    Best Regards

    March 13, 2021 at 6:37 pm #273320

    Lexp
    Participant

    Hi, thanks for getting back.
    This actually is not true, or I might have not been clear about what I mean:

    Looking at the standard Woocommerce demo here you will notice the button for add to cart is grey. As soon as you select the variation (size) the button becomes black.

    Looking at your demo, for example the panton product, the button is green, and does not change after selecting the variation.

    March 14, 2021 at 12:38 pm #273396

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    body .single_add_to_cart_button.alt{
color:red;
background:yellow;
}

    Best Regards

    March 14, 2021 at 7:14 pm #273446

    Lexp
    Participant

    Thanks but this only changes the color of the button. I want the color to be depending on if the button is “clickable” or not (just like it is by default in woocommerce)

    By default in woocommerce the button is grey if you cannot click it, and becomes
    black/ different color as soon as you can click it (after the variation is selected)

    Please also see the link in previous post above. When selecting the size, the color of the button becomes black. This is a default function in Woocommerce but not working in your theme.

    March 15, 2021 at 9:03 am #273531

    Elise Noromit
    Member

    Hello,

    Please replace the custom with this one: 

    .single_add_to_cart_button.disabled {
	background-color: #BFBFBF;
}
.single_add_to_cart_button.disabled:hover {
	background-color: #A3A3A3;
}

    Best Regards

    March 15, 2021 at 8:10 pm #273701

    Lexp
    Participant

    Great thanks, that did the trick! 🙂

    March 16, 2021 at 12:15 am #273745

    Elise Noromit
    Member

    You are welcome! If you have any questions please feel free to contact us.

    We will appreciate highly if you spend a couple of minutes and answer the questions provided here: https://8uehqcg4tjy.typeform.com/to/IgyV2EiP

    Best Regards

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)