Created
July 13, 2021 10:09
-
-
Save LeMiira/70b947d394656f724ff7592f1736df05 to your computer and use it in GitHub Desktop.
dd to Cart Quantity Plus & Minus Buttons
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//https://www.tychesoftwares.com/how-to-add-plus-and-minus-buttons-to-the-quantity-input-on-the-product-page-in-woocommerce/ | |
add_action( 'woocommerce_after_add_to_cart_quantity', 'ts_quantity_plus_sign' ); | |
function ts_quantity_plus_sign() { | |
echo '<button type="button" class="plus" >+</button>'; | |
} | |
add_action( 'woocommerce_before_add_to_cart_quantity', 'ts_quantity_minus_sign' ); | |
function ts_quantity_minus_sign() { | |
echo '<button type="button" class="minus" >-</button>'; | |
} | |
add_action( 'wp_footer', 'ts_quantity_plus_minus' ); | |
function ts_quantity_plus_minus() { | |
// To run this on the single product page | |
if ( ! is_product() ) return; | |
?> | |
<script type="text/javascript"> | |
jQuery(document).ready(function($){ | |
$('form.cart').on( 'click', 'button.plus, button.minus', function() { | |
// Get current quantity values | |
var qty = $( this ).closest( 'form.cart' ).find( '.qty' ); | |
var val = parseFloat(qty.val()); | |
var max = parseFloat(qty.attr( 'max' )); | |
var min = parseFloat(qty.attr( 'min' )); | |
var step = parseFloat(qty.attr( 'step' )); | |
// Change the value if plus or minus | |
if ( $( this ).is( '.plus' ) ) { | |
if ( max && ( max <= val ) ) { | |
qty.val( max ); | |
} | |
else { | |
qty.val( val + step ); | |
} | |
} | |
else { | |
if ( min && ( min >= val ) ) { | |
qty.val( min ); | |
} | |
else if ( val > 1 ) { | |
qty.val( val - step ); | |
} | |
} | |
}); | |
}); | |
</script> | |
<?php | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment