One of them is the shortcode
[add_to_cart] which allows printing the Add to Cart button for a specific product on your site.
It only shows the button though, you can’t choose the quantity of that product without going to the cart page before.
You can include the quantity field tweaking the default template.
Let’s see how.
Loop Add to Cart (3962 downloads)
Download the zip above and extract it. Put the file add-to-cart.php in wp-content/themes/your-theme-name/woocommerce/loop/. This path may not exists, if it’s your case, create it and then paste the file in it.
This file will include the field in the shortcode which will show like this in Storefront:
What does it change?
The template above includes this code:
if prevents the quantity field to show also on the Shop page and on the product category and tag archives.
The code inside the
if prints the quantity field and makes it look better.
This JS makes sure that when you update the quantity field, also the button is updated so when you click on it, the correct quantity is added to the cart.Loop Add to Cart (3962 downloads)