0

I'm selling posters and I need to make a custom quantity step value which changes as it goes up. Something like: 100, 500, 1000, 2500, 10000, 20000.

My code overrides the WC quantity but is there a way I could make a list of step values, rather than just setting the step as 500 as I have below?

add_filter( 'woocommerce_quantity_input_args', 
'posters_woocommerce_quantity_input_args', 10, 2 );

function posters_woocommerce_quantity_input_args( $args, $product ) {
$args['input_value']  = 1;    // Starting value
$args['max_value']    = 20000;   // Maximum value
$args['min_value']    = 100;    // Minimum value
$args['step']         = 500;    // Quantity steps
return $args;
}
1

1 Answer 1

2

unfortunately, the quantity input doesn't support this. The quantity input is rendered in the following template: global/quantity-input.php. You can see in the template that it's using an html input element, of type 'number', which doesn't support custom steps. Using a filter in this case just can't work.

If you are sure that you will always want the custom steps in the quantity input, you could override the template in your theme/plugin and custom code the html input.

If you want to get a little more technical, you could use the wc_get_template filter to only display your custom steps input if there is a certain argument present in the quantity input args.

The code below isn't tested, but hopefully it will point you in the right direction :)

add_filter( 'woocommerce_quantity_input_args', 'posters_woocommerce_quantity_input_args', 10, 2 );

function posters_woocommerce_quantity_input_args( $args, $product ) {
    $args['input_value']  = 1;    // Starting value
    $args['custom_steps'] = [100, 500, 1000, 2500, 10000, 20000]
    return $args;
}

add_filter('wc_get_template', 'posters_woocommerce_quantity_input_template', 10, 5);

/**
 * Filter to override the template for quantity_input.php
 */
function posters_woocommerce_quantity_input_template($located, $template_name, $args, $template_path, $default_path) {
    if ($template_name === 'global/quantity_input.php' && isset($args['custom_steps']) {
        // Override the template because custom steps are present.
        $located = 'global/custom_quantity_input.php';
    }
    return $located;
}

Then in your theme, create a new template woocommerce/global/custom_quantity_input.php by copying the global/custom_quantity_input.php template and modify it to create a html <select> with options based on the custom steps you've specified.

// ...

<div class="quantity">
    <label class="screen-reader-text" for="<?php echo esc_attr( $input_id ); ?>"><?php esc_html_e( 'Quantity', 'woocommerce' ); ?></label>
    <select
        id="<?php echo esc_attr( $input_id ); ?>"
        name="<?php echo esc_attr( $input_name ); ?>"
        value="<?php echo esc_attr( $input_value ); ?>"
        title="<?php echo esc_attr_x( 'Qty', 'Product quantity input tooltip', 'woocommerce' ); ?>"
        aria-labelledby="<?php echo esc_attr( $labelledby ); ?>">
        <?php 
        // Render each step as an option in a select drop down.
        foreach ($args['custom_step'] as $step) { 
        ?>
            <option value="<?php echo esc_attr( $step ); ?>"><?php esc_html_e( $step ); ?></option>
        <?php } // end foreach ?>
    </select>
</div>

// ...

This is just an idea. I'm pretty sure it should work in principle. Hope it helps.

Not the answer you're looking for? Browse other questions tagged or ask your own question.