Modifying “Add to Cart” Button Behavior in WooCommerce
-
Hello Support Team,
I would like to modify the WooCommerce “Add to Cart” button behavior as follows:
1. When the “Add to Cart” button is clicked, the selected item should be added to the cart, and the button should change to a quantity selector with plus (+) and minus (-) buttons.
2. The quantity in the cart should be adjustable using the plus/minus buttons, without displaying a “View Cart” button.
3. If the quantity is reduced to zero, the button should revert to the original “Add to Cart” state.
For reference, here are examples of the desired functionality:
Onsitego Example – https://onsitego.com/ac-service-repair-delhi-noida-gurgaon
Woolworths Example – https://www.woolworths.com.au/shop/browse/fruit-veg/fruit
Could you please guide me on how to achieve this? I appreciate your help.
Best regards,
Amit
If this is not possible by default, could you please provide some jQuery or functions.php code to hide or unhide the button as follows?
– .cart .quantity should be hidden by default.
– When I click the “Add to Cart” button and one quantity is successfully added, .cart .single_add_to_cart_button should be hidden, and .cart .quantity should be shown.
– If the quantity is decreased to zero, .cart .quantity should be hidden, and .cart .single_add_to_cart_button should be shown again.
Hi Amit,
Thanks for reaching to us.
Unfortunately, that is not possible, customization is out of our basic support. You need to find a third-party plugin to achieve more functionality that best suits you.
Regards,
This functionality is most suitable for small spaces where the quantity selection and “Add to Cart” button should be merged into one. It could be beneficial for WoodMart. Don’t you think?
Hi Amit,
Thanks for your patience.
Currently, WoodMart has an option Quantity input on product in Theme Settings > Product archive > Products styles https://prnt.sc/LqS-7DFIDKMg and No action option for the Action after add to cart https://prnt.sc/1ElD1GWQz_vv
While auto update quantities works for Cart page only.
Hope it helps.
Regards,
.
