Code Snippet: WooCommerce quantity select field

For a client project we’re currently working on, I get to dive into WooCommerce for the first time. The client was already using JigoShop—WooCommerce was forked from that project—so WooCommerce was a logical upgrade.

One thing that frustrated me was how WooCommerce used a number input field for setting the quantity a customer wanted to purchase. A select field felt more natural, perhaps because that’s what Amazon (and other eCommerce behemoths) use. Using a select field for quantity inputs improves the user experience, and looks better too!

There are a number of code snippets that purport to replace WooCommerce’s quantity inputs with a quantity select field floating around the web, but they all had problems. Some only worked on the product page but not the cart. Others worked in both places, but didn’t properly update the quantity in certain places, or didn’t accurately reflect the current quantity.

Using the code from this version by Github user “kloon” as a starting point, I fixed it up so it worked exactly as desired: it correctly updates the quantity, and reflects the current quantity in the cart. Check out the snippet after the jump!

All you need to do is download this file and place it at yourtheme/woocommerce/global/quantity-input.php — it will automatically override WooCommerce’s native quantity input and you’ll be on your way to select field awesomeness!

Want more eCommerce tips?

If you're building an eCommerce shop, we think you'd like our (infrequent) emails. You'll get code snippets, business advice, and more. Sign up below.


  1. Nice, this goes straight into my snippets repo!

    Comment — May 12, 2014 @ 9:03 pm
  2. This is great! Any idea on how to make the totals auto-update after select via jquery?

    Comment — June 23, 2014 @ 6:28 pm
  3. Sort of! I have a snippet that I used to do something like that. It’s not perfect but I’ll try to get it cleaned up and publish it!

    Comment — June 23, 2014 @ 6:51 pm
  4. That would be awesome!

    Comment — June 24, 2014 @ 7:20 pm
  5. Ryan Ours wrote:

    This snippet works great! The only place I’ve found an issue is with a new WooCommerce extension that WooThemes recently released called One-Page Checkout. It allows you to make a page or a post function as a one-page checkout for any product.

    The problem is that when this page is loaded for a given product, even though the select box says “1”, there is nothing in the cart. Also, when you change the quantity to a higher number, nothing is ever added to the cart. I’m assuming I’d need to hook into some sort of JavaScript function when the select changes to update the cart. Any thoughts?

    Comment — November 5, 2014 @ 10:15 am
  6. Ryan Ours wrote:

    Hey Michael,

    I created a quick snippet to put into my functions.php file that updates the cart total when the Qty select is changed (on the cart page). You can check it out at

    Let me know if you have any questions.

    Comment — November 5, 2014 @ 2:53 pm
  7. That’s pretty sweet—thanks for sharing!

    Comment — November 5, 2014 @ 3:17 pm
  8. Tek wrote:

    Nice one. This goes straight to my page.
    One thing i noticed is the quantity selector is really close to the purchase button.

    How could i add some spacing there?

    Comment — March 17, 2015 @ 3:10 pm
  9. Adam Schmid wrote:

    Hi, This snip is great but it does not return the quantity of the product for the max_value. Is there a way to go through the loop using the actual quantity available for the iterator end?

    Comment — May 15, 2015 @ 3:52 pm
  10. Brian Hunt wrote:

    Hey this code is awesome but is there a way to have it not applied to products that are specified as “sold individually” in Woocommerce. Or even have it applied to only certain product categories?

    Comment — May 22, 2015 @ 9:46 am
  11. Jeff DiSario wrote:

    The site I am working on sells roses by the dozen. Is there a way to have the quantity field read “1 dozen, 2 dozen, 3 dozen, etc” instead of just reading “1,2,3, etc?”

    Comment — June 7, 2015 @ 10:21 pm
  12. Pim Duijst wrote:

    Hi, I have implemented this snippet in my child theme dir and it shows an dropdown select but it does not update the quantity. I am using the One Page Checkout plugin… Can you give me some help why it’s not working?

    Comment — September 28, 2015 @ 9:18 am
  13. Pim Duijst wrote:

    Hi Chris,

    Could you maybe share that snippet too?

    Comment — September 28, 2015 @ 10:49 am
  14. Anderson wrote:


    Comment — October 16, 2015 @ 11:39 am
  15. Pim Duijst wrote:

    Hi, did you manage to implement this snippet working and updating the one page checkout?

    Comment — November 6, 2015 @ 7:30 am
  16. Tyler Johnson wrote:

    You can do this by adding “dozen” after $count . ‘ and before .

    Comment — November 19, 2015 @ 1:22 pm
  17. Thomas Scherner wrote:

    Thanks for this Stippen. It Work Great on all. Only the Format on my Site ist Not so Fine. The Selctfield is over the Place in Cart Button.

    Can you help me please??

    For example please take a Look herne:


    Comment — December 9, 2015 @ 5:30 am

Leave a comment