Get Started

How to Add or Remove the WooCommerce Checkout Coupon Field

Editorial Team
April 19, 2024
How to Add or Remove the WooCommerce Checkout Coupon Field

Are you looking to add a coupon field to the WooCommerce checkout page or perhaps remove it altogether? Maybe you're seeking a way to relocate the coupon field from its default position.

While WooCommerce's default settings include a coupon field at the top of the checkout page, it may not always align with your store's layout or design preferences.

Unfortunately, WooCommerce lacks a direct option to remove the coupon field exclusively from the checkout page without affecting the cart page or even relocating it.

In this blog, we will share how to add a coupon field to your WooCommerce checkout page and provide solutions for removing or relocating it within the checkout page if needed.

Let’s begin. 

What is a WooCommerce Coupon Field?

A WooCommerce coupon field is a feature that allows customers to apply discount codes or coupons on the checkout page during the buying process. 

By entering a valid coupon code, customers can avail themselves of various promotional offers, such as:

  • Percentage discounts
  • Fixed amount discounts
  • Free shipping or other incentives provided by the store owner 

The coupon field enhances the shopping experience by allowing customers to save money, thereby encouraging them to complete their purchases.

Note: WooCommerce, by default, doesn’t offer a coupon field on the checkout page. 

Move to the next section to learn why you should make an extra effort to add a custom field, such as a coupon field, to your WooCommerce checkout page.

Why You Should Add a WooCommerce Coupon Field?

In today's competitive landscape, every aspect of the customer experience matters. Failing to integrate a coupon field directly onto the checkout page can potentially disrupt the flow of the buying process and hinder customer satisfaction.

By addressing this issue and adding a coupon field to the WooCommerce checkout page, you can significantly enhance the overall shopping experience for your customers.

Here are some of the benefits of adding a coupon field to WooCommerce checkout: 

  • Convenience for customers: Placing the coupon field on the checkout page eliminates the need for customers to navigate back to the cart page to apply their coupons if they missed doing so earlier. This streamlines the checkout process, saving time and enhancing convenience for shoppers.
  • Seamless “Buy Now” integration: For customers utilizing the "Buy Now" option, having the coupon field directly on the checkout page ensures seamless integration of any available discounts into their quick checkout process. This integration prevents disruption and allows for immediate application of coupons before finalizing the purchase.
  • Enhanced user experience: Integrating the coupon field into the checkout page improves the overall user experience. It provides customers with a consistent and intuitive interface, reducing confusion and friction during checkout. With the coupon field readily accessible, customers can easily apply discounts, enhancing satisfaction and encouraging repeat purchases.
  • Promotion of specific offers: Adding a coupon field to the checkout page effectively promotes specific offers, such as discounts, to clear out slow-moving inventory. For example, highlighting a "Buy One, Get One Free" deal encourages customers to take advantage of the discount, increasing the likelihood of repeat purchases as they appreciate the savings and return for future deals.
  • Increased order value with pre and post-purchase upsells: When users apply a discount coupon at checkout and see that they are saving a significant amount, they are likely to purchase more items. You can capitalize on their buying momentum by offering order bumps and upsells, thus increasing the average order value of your store.

We hope you now understand that while most ignore this, treating it as a small addition and adding a coupon field can bring a lot of benefits to your WooCommerce store. 

🔔Note: While having a coupon field in WooCommerce checkout has many perks, you may want to relocate it for better results or remove it depending on your strategy. We will cover everything later in this blog. 

Top 3 WooCommerce Checkout Coupon Plugins 

Here are the top 3 WooCommerce checkout coupon plugins for adding a coupon field to your WooCommerce checkout and maximizing profits with coupon codes:

1. FunnelKit Funnel Builder 

FunnelKit Funnel Builder is the best WooCommerce sales funnel builder. It allows you to create conversion-optimized checkout pages. You can easily change the location of the WooCommerce checkout coupon field by dragging and dropping. 

This plugin aims to enhance users’ shopping experiences while increasing your store's average order value by offering pre- and post-purchase upsells within a sales funnel

funnelkit

Here are the key features: 

  • Coupon field integration: Rearrange the coupon field to your WooCommerce checkout anywhere you want with just a simple drag and drop. If you want, you can hide it as well. 
  • Mini cart with coupon field: FunnelKit Funnel Builder lets you add a mini cart to your checkout page, including a coupon field, order summary, and quantity adjustment options for cart items. This is a great location to place the WooCommerce checkout coupon field. 
  • Conversion-optimized checkout page: Create a conversion-optimized checkout page that’s either one page or multi-step. You can also optimize other impact aspects like Google address autocomplete, one-click express checkout, enhanced phone field, etc. 
  • AOV Boosting features: Provide AOV boosting features such as a pre-purchase order bump on the checkout page and a one-click upsell after checkout. You can easily customize the look of these order bumps and one-click upsell offers. 
  • Prebuilt templates: FunnelKit Funnel Builder offers 30+ prebuilt sales funnel and lead generation templates, including opt-in pages, opt-in confirmation pages, sales pages, checkout pages, upsell pages, and thank you pages. 
  • Compatibility with popular page builders: Enjoy seamless compatibility with all major page builders, allowing easy customization and integration into your existing website design.

Price:  A free version of FunnelKit Funnel Builder is available. However, with this plugin, you would need the pro version to add a coupon field to the checkout page. The premium version starts at $99.5/year. 

2. Advanced Coupon 

The Advanced Coupon plugin lets you create smart coupons that users can apply on the checkout page to claim various discounts and offers. 

This invaluable plugin allows you to create different coupons, like WooCommerce coupons, store credits, gift cards, loyalty programs, BOGO Coupons, and discount rules. 

You can use FunnelKit Funnel Builder to create a beautiful checkout page with a coupon field and Advanced Coupon to create smart coupons that customers can apply on the checkout page. 

advanced coupons

Here are some of the key features: 

  • Flexible coupon rules: Create advanced coupon rules based on factors such as product attributes, cart subtotal, user roles, and more.
  • BOGO Deals (Buy One Get One): Support for creating buy one, get one (BOGO) deals, including variations like buy X, get Y at a discount, or buy X, get Y free.
  • Scheduled coupons: Schedule coupon activation and expiration dates. This allows you to run promotions for specific time periods automatically.
  • Usage limits: Set usage limits per coupon or customer to control how many times a coupon can be redeemed.
  • Coupon exclusions: Exclude specific products, categories, or sale items from coupon discounts, providing more control over which products are eligible for discounts.

Price: It’s a freemium plugin. The premium version starts at $119.00 for a single site. 

3. FunnelKit Cart

FunnelKit Cart replaces the cart page with a modern sliding cart that users can use to view and update the cart items. 

With this side cart, users can apply coupon codes inside the cart itself and also head out directly to the checkout page without having to visit the cart page. 

The best part about this sliding cart is that it streamlines the shopping experience by eliminating the cart page step and helps boost average order value by offering in-cart product recommendations and a milestone-based reward system. 

funnelkit cart

Here are some of the key features: 

  • A modern side cart: This plugin adds a modern side cart to the WooCommerce store that users can access from anywhere on the website. Users can view, update, or delete cart items.
  • Replace the cart page: You can replace the cart page with a side cart and reduce the number of steps a customer takes to place an order. This ensures a smoother shopping experience.
  • In-cart coupon field: FunnelKit Cart also offers a coupon field that users can use to apply coupon fields to claim discounts or offers before moving to the checkout page. 
  • In-cart product recommendation: You can offer upsell and cross-sell products inside the cart that users can easily add with a single click. 
  • Smart milestone-based rewards: Smart milestone-based rewards: Offer three types of rewards—free shipping, discounts, and free gifts—based on different milestones users reach by increasing their order total. 

Price: The basic version of FunnelKit Cart is free to use. You can buy the pro version with the FunnelKit Funnel Builder Plus and the above package, which starts at $99/year. 

We have compiled these three plugins because each serves a different purpose, cumulatively making the WooCommeere checkout coupon as profitable as possible. 

For instance, with FunnelKit Funnel Builder, you can place the coupon field anywhere on the checkout page, like a mini cart.

With an Advanced coupon, you can create smart coupons like BOGO and another discount coupon that users can apply to claim a discount, which will make the customers happy and keep them coming back. 

Also, with FunnelKit Funnel Builder, you can eliminate the cart page, optimize the buying process, and effectively boost average order value. 

Method 1: How to Add a Coupon Field to WooCommerce Checkout (With Default Option)

To add a checkout coupon to WooCommerce checkout, follow these steps:

Step 1: Navigate to WooCommerce settings 

From the WordPress dashboard, navigate to WooCommerce ⇒ Settings and make sure you are on the General settings tab. 

WooCommerce general settings

Step 2: Enable the use of coupon codes on the checkout

Now scroll down and check the option “Enable the use of coupon codes.”

🔔Note: Enabling this option will add a coupon field to both the cart and checkout pages. 

Click on “Save Changes” to update the settings. 

add wooCommerce checkout coupon field

Step 3: Test the checkout page with the coupon field 

Now try placing an order, and on the checkout page, you should see a coupon field at the top. 

default coupon code WooCommerce

This is how you can add a coupon field to your checkout page with the default option. At the same time, it does the job; it doesn't give you the flexibility to change the location of the coupon field. 

Also,  the top position isn’t the most user-friendly because when users apply the coupon code, they have to scroll down to see the offer they are getting.

In the next section, we will share a better way of adding a coupon field to the checkout page with more flexibility. 

Method 2: How to Add and Move Coupon Field In Checkout Page in WooCommerce (With a Free Plugin)

In this section, we will share how you can replace the default WooCommerce checkout page with a better-looking checkout page and how you can control the placement of the coupon field to make it more convenient for your customers.

We will use the free version of FunnelKit Funnel Builder. 

🔔 You can refer to the documentation on how to install and activate FunnelKit Funnel Builder.

Step 1: Set up your store checkout

Now let’s create a custom checkout for your WooCommerce store. For that, navigate to FunnelKit ⇒ Store Checkout.

WooCommerce store checkout

Now, choose your preferred page builder and the template you like. We are choosing Hific here because it has a free version.

After that, choose a page builder to filter the sales templates. To check any template, hover on it and click on the preview button.

click preview hific

With the free version of FunnelKit Funnel Builder, you can only create a single-page checkout. However, if you opt for the pro version, you can create a multi-page checkout that’s more conversion-optimized.

Now, to import, click on the “Import this Template” button to import the template. After that, provide a store checkout name.

import hific as store checkout

This will import two templates: checkout and thank you page. 

Step 2: Edit the checkout page to customize the coupon field

Next, you need to edit the checkout page. To do so, click on the checkout page option.

click on checkout

Now, you can edit the checkout page design and content with the page builder you have chosen, which, in our case, is Elementor. 

So, click on the “Edit Elementor Template” option to customize the checkout page.

edit hific elementor checkout tempalte

After customizing the content, scroll down to the checkout Form Fields section. Here, you should see the Coupon code placed right before the order summary section. 

We think this is a great placement, as users can see how the coupon code affects the order details right below the coupon field. 

Here is a preview of the coupon field: 

WooCommerce checkout coupon field

Customize the coupon field. 

As you can see, the coupon field is basic. However, you can make it a clickable link. To do so, click on the Coupon Field and turn on the option ”Make Coupon Field a Clickable Link.”

You can also update the Label and make it required if you want. 

Make sure to click on ‘Update’ to save the changes. 

🔔Note: If you want to change the color, padding, border etc of the checkout coupon field, you can do so while editing the checkout page with your preferred page builder. 

make WooCommerce checkout coupon field clickable

Here is what the clickable coupon field looks like:

preview clickable coupon field in WooCommerce checkout

Step 3: Move the coupon field to a different location (optional)

If you have a question like, “How do I move the WooCommerce coupon field on the checkout page?” The answer is simple.

To change the order of the coupon form field, all you have to do is drag and drop the coupon field to the desired location. 

move checkout coupon field

For instance, we are moving the coupon code field to after the order summary.

move WooCommerce checkout coupon field

Make sure to click on ‘Save’ to update the changes. 

Here is the preview of the coupon field in a new location: 

move WooCOmmerce checkout coupon field to a custom place

You can also customize the thank you page

🔔 Note: If you upgrade to the pro version, you can offer an order bump and one click upsell to effectively increase the average order value of your store. 

Step 4: Enable the store checkout 

Lastly, click on the "Enable Store Checkout" button to activate the store checkout. 

enable store checkout to allow checkout coupon autoapply

This is how you can add a checkout coupon field to WooCommerce checkout and place it wherever you want.

We have talked about adding a coupon field to checkout until now, but how about hiding or removing the coupon field? 

That’s what we will cover in the next section. 

How to Hide/Remove Coupon Field From WooCommerce Checkout Page? 

Here, we will share two ways to remove or hide coupon field from the WooCommerce checkout page: 

1. Using WooCommerce default settings 

To use this method, navigate to WooCommerce ⇒ Settings ⇒ General and uncheck the option “Enable the use of coupon codes.” Make sure to click on Save Changes to update. 

remove coupon from WooCommerce checkout

🔔Note: Enabling this option will add a coupon field to both the cart page and checkout page. 

However, you can solve this problem by eliminating the cart page and replacing it with a sliding cart using FunnelKit Cart. 

For more details, read the blog “How to Skip WooCommerce Cart Page”.

2. Using a custom checkout with FunnelKit Funnel Builder 

If you are using FunnelKit Funnel Builder to create your checkout page and add a coupon field, then removing the coupon field is way easier than you think. 

To remove the coupon field from your WooCommerce checkout page, edit the checkout page, scroll down to the Checkout Form Fields section, hover on the Coupon field, and click on the ‘X’ icon. 

Make sure to click on Save to update the changes. 

remove WOoCOmmerce coupon code field

These were two ways of removing the WooCommerce checkout coupon. Depending on the method you use to add one, follow the relevant process to remove it. 

How to Create a WooCommerce Checkout Coupon URL? 

A WooCommerce checkout coupon URL is a URL that directs users directly to the checkout page, where specific products are added to the order details, and automatically applies a preset coupon code.

This is quite effective if you want to run a special discount offer for a specific group of people, as you can share the URL with only those people. 

With FunnelKit Funnel Builder, you can easily create a WooCommerce checkout coupon URL. To do this, you need to have the premium version of FunnelKit Funnel Builder. 

After that, Edit the checkout and move to the Optimization tab.  Here, scroll down to the “Generate URL to populate checkout” section and expand the section. Then, set the following values: 

  • Product: Add the Product IDs separated by commas that will be added to the cart when users hit the URL.
  • Quantity: Provide the quantity of the products separated by commas. Make sure to follow the same sequence you used in the product IDs.
  • Coupons: Add the coupon you want to apply to the cart when customers use this URL.

After providing the URL, you will find the WooCommerce Checkout Coupon URL in the field “Coupon URL”.

set up WooCommerce checkout url

Make sure to hit Save. 

Now, you can share this WooCommerce Checkout Coupon URL with the target audience via social or broadcast SMS and email campaigns. 

Here is a preview of the WooCommerce checkout coupon URL: 

WooCommerce checkout coupon url preview

The above multi-step checkout is built with FunnelKit Funnel Builder’s Hific template. This is a premium template available with FunnelKit Funnel Builder. As you can see it also has a beautiful mini cart, and the checkout coupon field is set just below it, making it convenient for users. 

Note: You can also auto-apply a coupon code to the checkout page using FunnelKit Funnel Builder. 

Frequently Asked Questions About WooCommerce Checkout Coupon

Here are some common questions people ask about WooCommerce checkout coupons:

  • How to hide coupon field from the WooCommerce checkout form?

You can hide/remove the coupon field from the WooCommerce checkout form using default settings. However, note that this action will also remove it from the cart page.

If you only want to remove the coupon from the checkout form, you can use FunnelKit Funnel Builder to create your checkout page and remove the coupon field.

  • How can coupons be limited in WooCommerce with guest checkout? 

You can’t limit coupons with guest checkout using the WooCommerce default option. Instead, you can rely on a plugin like Advanced Coupon, which restricts coupons based on user roles. 

  • How to move the WooCommerce coupon field on the checkout page? 

With FunnelKit Funnel Builder, you can easily move the coupon field from the default top place and relocate it to anywhere on the checkout page form. 

Ready to Utilize WooCommerce Checkout Coupons to Boost Sales? 

Offering discounts serves as the push users need to place an order. If you’re considering offering a discount coupon, you should present it on the checkout page.

Why? Because the checkout page represents a crucial stage in which many users abandon their carts. By offering a WooCommerce checkout coupon, you can motivate users to complete their purchases.

It's crucial to position your WooCommerce checkout coupon strategically to maximize its effectiveness. With FunnelKit Funnel Builder, you can easily achieve this. Additionally, keep in mind that you can enhance your store's average order value with order bumps and upsell offers.

Our experts highly recommend replacing the cart page with a slide-in cart provided by FunnelKit Cart, as it streamlines the entire shopping experience.

So, are you ready to harness the power of WooCommerce checkout coupons to drive sales effectively?

Author: Editorial Team
The Editorial Team at FunnelKit (formerly WooFunnels) is a passionate group of writers and copy editors. We create well-researched posts on topics such as WordPress automation, sales funnels, online course creation, and more. We aim to deliver content that is interesting and actionable.
chevron-down