Customize WooCommerce Quantity Selector

Question

I'm trying to change the default +/- quantity selector into a drop down menu with a given amount of number options (i.e. 1-10).

Anyone know how to accomplish this?

Let me know if you'd like me to post any of the code related to this.

Solution 1

There is a plugin that will do this for you called WooCommerce Advanced Product Quantities, it's free and will allow you to set Minimum, Maximum and Step values for all product quantity inputs. Set rules on a per product, per category/tag or site wide.

http://wordpress.org/plugins/woocommerce-incremental-product-quantities/

It also works with WooCommerce Thumbnail Input Quantities which will put those quantity boxes in all of your product thumbnail boxes.

http://wordpress.org/plugins/woocommerce-thumbnail-input-quantities/

Enjoy! Full disclosure, I'm the plugin author.

Solution 2

I'd like to do this too. So far I found that the quantity markup is generated in woocommerce/templates/single-product/add-to-cart/quantity.php. You could make a copy of this file in a minimal mirror of the woocommerce/templates directory structure in your theme folder, e.g. in this case copy it to yourtheme/woocommerce/single-product/add-to-cart. There you can edit it without altering the plug-in and risk it being overwritten when the plug-in is updated.

Solution 3

I have not tried this, but I found this code http://bastutor.blogspot.ca/2014/01/woocommerce-change-input-quantity-to-dropdown.html

/* Change Product Quantity Input to Dropdown */
function woocommerce_quantity_input() {
 global $product;

 $defaults = array(
  'input_name' => 'quantity',
  'input_value' => '1',
  'max_value'  => apply_filters( 'woocommerce_quantity_input_max', '', $product ),
  'min_value'  => apply_filters( 'woocommerce_quantity_input_min', '', $product ),
  'step'   => apply_filters( 'woocommerce_quantity_input_step', '1', $product ),
  'style'   => apply_filters( 'woocommerce_quantity_style', 'float:left; margin-right:10px;', $product )
 );

 if (!empty($defaults['min_value']))
  $min = $defaults['min_value'];
  else $min = 1;

 if (!empty($defaults['max_value']))
  $max = $defaults['max_value'];
  else $max = 20;

 if (!empty($defaults['step']))
  $step = $defaults['step'];
  else $step = 1;

 $options = '';
 for($count = $min;$count <= $max;$count = $count+$step){
  $options .= '<option value="' . $count . '">' . $count . '</option>';
 }

 echo '<div class="quantity_select" style="' . $defaults['style'] . '"><select name="' . esc_attr( $defaults['input_name'] ) . '" title="' . _x( 'Qty', 'Product quantity input tooltip', 'woocommerce' ) . '" class="qty">' . $options . '</select></div>';
}