Move the WooCommerce Coupon Field Above the Payment Methods

Steps to Implement

  1. Add the code snippet to your website by modifying your theme or using WPCode.
  2. Copy the form-coupon.php WooCommerce template to your theme.
  3. Add <div class="woocommerce-coupon-container"> before the first div tag in the form-coupon.php file.
  4. Add <div> after the closing form tag in the form-coupon.php file.
/**
 * Move the WooCommerce coupon field above the payment methods.
 */
(function($) {
    var coupon = $('.woocommerce-coupon-container'); // The container we added to form-coupon.php.
    $(coupon).insertBefore('.woocommerce-checkout-payment');
})(jQuery);