Home » WooCommerce: Change Add to Cart Quantity into a Select Drop-down

WooCommerce: Change Add to Cart Quantity into a Select Drop-down

by Tutor Aspire

The default WooCommerce Add to Cart “Quantity Input” is a simple input field where you can enter the number of items or click on the “+” and “-” to increase/reduce the quantity.

A freelance client hired me to turn that input into a “Select” drop-down. For their audience and UX requirements, it makes sense to let their customers choose the quantity from a drop-down instead of having to manually input the number.

Online there are complex snippets, but I decided to make things easier. The WooCommerce function responsible to generate the quantity input is called “woocommerce_quantity_input“. Luckily, it’s a pluggable function – which means we can simply add this exact same function name to our child theme’s functions.php to completely override it.

WooCommerce: turn Add to Cart Quantity input into a select drop-down

PHP Snippet: Turn Add to Cart “Quantity” into a select drop-down – WooCommerce

/**
 * @snippet       Add to Cart Quantity drop-down - WooCommerce
 * @how-to        Get tutoraspire.com FREE
 * @author        Tutor Aspire
 * @testedwith    WooCommerce 5.0
 * @donate $9     https://www.tutoraspire.com
 */
 
function woocommerce_quantity_input( $args = array(), $product = null, $echo = true ) {
 
if ( is_null( $product ) ) {
   $product = $GLOBALS['product'];
}

$defaults = array(
'input_id' => uniqid( 'quantity_' ),
'input_name' => 'quantity',
'input_value' => '1',
'classes' => apply_filters( 'woocommerce_quantity_input_classes', array( 'input-text', 'qty', 'text' ), $product ),
'max_value' => apply_filters( 'woocommerce_quantity_input_max', -1, $product ),
'min_value' => apply_filters( 'woocommerce_quantity_input_min', 0, $product ),
'step' => apply_filters( 'woocommerce_quantity_input_step', 1, $product ),
'pattern' => apply_filters( 'woocommerce_quantity_input_pattern', has_filter( 'woocommerce_stock_amount', 'intval' ) ? '[0-9]*' : '' ),
'inputmode' => apply_filters( 'woocommerce_quantity_input_inputmode', has_filter( 'woocommerce_stock_amount', 'intval' ) ? 'numeric' : '' ),
'product_name' => $product ? $product->get_title() : '',
);

$args = apply_filters( 'woocommerce_quantity_input_args', wp_parse_args( $args, $defaults ), $product );
 
// Apply sanity to min/max args - min cannot be lower than 0.
$args['min_value'] = max( $args['min_value'], 0 );
// Note: change 20 to whatever you like
$args['max_value'] = 0 = 1 && $count == $args['input_value'] ) {
  $selected = 'selected';      
   } else $selected = '';

   $options .= '';

}
    
$string = '
Qty
'; if ( $echo ) { echo $string; } else { return $string; } }

You may also like