WooCommerce: Move / Remove Coupon Form @ Cart & Checkout

Coupons: the good, the bad and the ugly. WooCommerce coupon codes are great to convert more sales – but sometimes they get users to pause / stop placing the order until they find a coupon code online (you did it too, I know).

One good workaround that the internet giants such as Amazon and eBay have implemented is to hide the coupon form until an email is entered, or alternatively to move the coupon code to the bottom of the Cart page. This is a very smart move, and gets the user to concentrate on the Cart / Checkout details before entering or searching for a coupon.

So the question is – how to move the coupon code form in the Cart page and remove it from the Checkout page? Well, as usual, a bit of PHP can help us. Here’s how it’s done!

Move Coupon Code Form @ WooCommerce Cart

Snippet 1 (PHP+CSS): Move Coupon Form Under “Proceed to Checkout” @ WooCommerce Cart Page

First, we want to display a brand new coupon form under the “Proceed to Checkout” button on the Cart page. This is easily done by using the correct hook (“woocommerce_proceed_to_checkout”) and by printing the HTML code for the form.

Now to the existing coupon form… Unfortunately, unlike the rest of WooCommerce default elements, the coupon form is hardcoded into the Cart table i.e. there is no PHP function that can be “unhooked” via “remove_action”.

In plain English, there is no other way (as of now) to remove that coupon code via PHP, so we must use some annoying CSS. Here’s what you should add to your style.css to hide the default coupon form:

Snippet 2 (PHP): Remove “Have a Coupon?” Form @ WooCommerce Checkout Page