Skip to content

Instantly share code, notes, and snippets.

@Ercogx
Last active April 5, 2022 15:53
Show Gist options
  • Save Ercogx/8cb6fb8d35b3390150b10e6893b9970b to your computer and use it in GitHub Desktop.
Save Ercogx/8cb6fb8d35b3390150b10e6893b9970b to your computer and use it in GitHub Desktop.
WC coupon code in checkout form
<?php
// Add a custom coupon field before checkout payment section
add_action( 'woocommerce_checkout_order_review', 'woocommerce_checkout_coupon_form_custom' );
function woocommerce_checkout_coupon_form_custom() {
?>
<div class="add_gift_card_form coupon-fictitious-form">
<h4>Have a coupon?</h4>
<div id="wc_gc_cart_redeem_form">
<input placeholder="Coupon code" type="text" name="coupon_code" id="wc_gc_cart_code" autocomplete="off">
<button type="button" name="apply_coupon" id="wc_gc_cart_redeem_send">Apply</button>
</div>
</div>
<?php
}
// jQuery code
add_action( 'wp_footer', 'custom_checkout_jquery_script' );
function custom_checkout_jquery_script() {
if ( is_checkout() && ! is_wc_endpoint_url() ) :
?>
<script type="text/javascript">
jQuery( function($){
// Copy the inputed coupon code to WooCommerce hidden default coupon field
$('.coupon-fictitious-form input[name="coupon_code"]').on( 'input change', function(){
$('form.checkout_coupon input[name="coupon_code"]').val($(this).val());
});
// On button click, submit WooCommerce hidden default coupon form
$('.coupon-fictitious-form button[name="apply_coupon"]').on( 'click', function(){
$('form.checkout_coupon').submit();
});
});
</script>
<?php
endif;
}
.thb-checkout-coupon{
display: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment