Subtotal based Free Product

Learn how to offer a free product when customer spends X amount (based on order total) in your WooCommerce store

Ramesh avatar
Written by Ramesh
Updated over a week ago

Introduction :

The Subtotal based free product is a marketing technique that offers a free product to customers who spend a certain amount of money on other products. This user guide explains how to implement Subtotal based free products in your WooCommerce store.

The following are some of the examples of free product offers that are based on the order subtotal:

  • Offer a free cap when a customer spends $500 or more.

  • Offer a free t-shirt when the subtotal reaches $200. Customers can choose the color variant of their choice.

  • Offer a free cap when the subtotal reaches $250, and a free belt when the subtotal exceeds $500.

Before getting started, please make sure that you have installed and activated the “Discount Rules PRO” plugin. The above scenarios require the Buy X Get Y discount type feature, which is available only in the PRO version.

Let’s get started,

Example 1 : Offer a Free Product when customer spends $500 or above

This scenario lets customers get a free product when they spend $500 or more. The offer is based on the subtotal. Let’s create a discount rule for this offer.

Creating a Discount Rule

  • Go to WordPress dashboard -> WooCommerce -> Discount Rules -> Click on “Add New Rule” button.

  • Choose “Buy X Get Y” as the Discount type.

Here is the screenshot of the rule configuration that follows,

Rule Configuration :

Filter Section

Choose "All Products" in the "Filter" section because customers can buy any products in the store. The free product is given only when the subtotal reaches $500. (You also have options like categories, products, attributes, tags. These options will be helpful if you are looking to offers like Spend $500 on products from X & Y categories and get a free product.)

Discount Section

In the Discount Section, choose the Buy X Get Y Products. Because we are going to offer a specific product for free. In our example, it’s the “Cap”.

  • You will see an option to search and add the product. Type a few characters of the product name to find your product and select it.

  • Since the discount is based on the subtotal, the quantity should be 1 to 999. Set the “Free Quantity” as 1.

Conditions

In the conditions section, choose “Subtotal” and set the operator to be “Greater than” and enter the value 500.

Because, we are offering the free product when the subtotal reaches $500.

Once configured, save and publish the rule.

Now, when customers spend at least $500 in their cart, they will see the free product automatically added to their cart

Here is the screenshot of the cart page showing an example:

That’s a simple discount based on the subtotal. Let’s check a few more examples with advanced conditions.

Refer this video to know more about subtotal based free products :

Example 2 : Offer a Free T-Shirt when subtotal reaches $200 and above. Customers choose the variant

This example shows how you can offer a “Variable product” as a free product, allowing the customer to choose the variant of his choice. For example, we can offer a free T-shirt and let the customer choose its color.

Let’s create a discount rule based on this example:

Creating a Discount Rule

  • Go to your WordPress dashboard -> WooCommerce -> Discount Rules -> Click on the “Add New Rule” button.

  • Choose “Buy X Get Y” as the Discount type.

Here is the screenshot of the rule configuration that follows,

Rule Configuration:

Filter Section

Choose "All Products" in the "Filter" section because customers can buy any products in the store. The free product (Variable product) is given only when the subtotal reaches $200. (You also have options like categories, products, attributes, tags. These options will be helpful if you are looking to have buy products on specific category or attributes)

Discount Section

In the Discount Section, choose the Buy X Get Y Products. Because we are going to offer a specific variable product for free. In our example, it’s the “Round Neck T-shirt”.

  • You will see an option to search and add the product. Type a few characters of the product name to find your product and select it.

  • Since the discount is based on the subtotal, the quantity should be 1 to 999. Set the “Free Quantity” as 1.

Conditions

In the conditions section, choose “Subtotal” and set the operator to be “Greater than” and enter the value 200.

Because, we are offering the free product when the subtotal reaches $200.

Once configured, save and publish the rule.

Now, when customers spend at least $200 in their cart, they will see the free product automatically added to their cart.

Here is the screenshot of the cart page showing an example:

Customers can select the desired T-shirt variant by clicking the "change variant" option.

Example 3 : Providing a Free Cap for a $250 Subtotal and a Free Belt for a $500 Subtotal

This example shows how you can offer free products based on tiered Subtotal conditions like customers get product A free when they spend $250 - $500 and when customer spends more than $500 product A automatically removes and Product B would be added in the cart.

Since we have two different scenarios here, it's recommended to make two separate discount rules with different conditions for each of them. Let’s create discount rules for this offer.

Creating a Discount Rule

Rule 1 :

  • Go to WordPress dashboard -> WooCommerce -> Discount Rules -> Click on “Add New Rule” button.

  • Choose “Buy X Get Y” as the Discount type.

Here is the screenshot of the Rule 1 configuration that follows,

Rule Configuration :

Filter Section

Choose "All Products" in the "Filter" section because customers can buy any products in the store. The free product is given only when the subtotal reaches between $250 - $500. (You also have options like categories, products, attributes, tags. These options will be helpful if you are looking to have buy products on specific category or attributes)

Discount Section

In the Discount Section, choose the Buy X Get Y Products. Because we are going to offer a specific variable product for free. In our example, it’s the “Cap”.

  • You will see an option to search and add the product. Type a few characters of the product name to find your product and select it.

  • Since the discount is based on the subtotal, the quantity should be 1 to 999. Set the “Free Quantity” as 1.

Conditions

In the conditions section, choose “Subtotal” and set the operator to be “Greater than or equal” and enter the value 250.

Add another condition, choose “Subtotal” and set the operator to be “Less than or equal” and enter the value 500.

Because, we are offering the free product when the subtotal reaches between $250 - $500.

Once configured, save and publish the rule.

Now, when customers spend at least $250 or at most $500 in their cart, they will see the free product automatically added to their cart.

Here is the screenshot of the cart page showing an example:

Rule 2 :

  • Go to WordPress dashboard -> WooCommerce -> Discount Rules -> Click on “Add New Rule” button.

  • Choose “Buy X Get Y” as the Discount type.

Here is the screenshot of the Rule 2 configuration that follows,

Rule Configuration :

Filter Section

Choose "All Products" in the "Filter" section because customers can buy any products in the store. The free product is given only when the subtotal reaches above $500. (You also have options like categories, products, attributes, tags. These options will be helpful if you are looking to have buy products on specific category or attributes)

Discount Section

In the Discount Section, choose the Buy X Get Y Products. Because we are going to offer a specific variable product for free. In our example, it’s the “Belt”.

  • You will see an option to search and add the product. Type a few characters of the product name to find your product and select it.

  • Since the discount is based on the subtotal, the quantity should be 1 to 999. Set the “Free Quantity” as 1.

Conditions

In the conditions section, choose “Subtotal” and set the operator to be “Greater than” and enter the value 500.

Because, we are offering the free product when the subtotal reaches above $500.

Once configured, save and publish the rule.

Now, when customers spend above $500 in their cart, they will see the free product automatically added to their cart.

Here is the screenshot of the cart page showing an example:

If the cart subtotal falls between $250 and $500, the free cap will be added to the cart. If the cart subtotal is over $500, the free cap will be removed, and the free belt will be added automatically to the cart.

Frequently Asked Questions :

1. How can I allow my customers the option to choose a free product when their subtotal reaches a certain amount?

Example : If you want to offer your customers the option to select a free product, you can set the mode of apply to "cheapest" when setting up your discount. This will allow the customer to choose from a selection of qualifying products when their subtotal reaches the specified amount.

Note : The discounts are only applicable when the customer manually adds the qualifying products to their cart.

Check out the following video tutorial for similar example:

2. I want to offer a free belt for orders over $100, but I don't want the belt's amount to be included in the subtotal.

This rule set-up will ensure that the value of the free product is not included in the subtotal.

Customisation

Sometimes, you may want to change the look and feel of the offer display.

You can consider using CSS to customise.

Here are a few example CSS styles that you can use:

1. Is it possible to change/translate the text Discount and Free?

Yes, you can do it using a translate plugin.

2. I want to change the color and style of Discount/Free Text

You can customize by adding CSS for this class : .awdr_free_product_text

Example :

.awdr_free_product_text

{

background-color : black !important;

}

You need to add this CSS in your theme's Additional CSS.

Please go to your WordPress Admin Dashboard -> Appearance -> Customize -> Additional CSS

There you can add you additional CSS styles

Here is a screenshot

3. I want to remove the Text "Discount".

You can add this CSS in your theme's Additional CSS.

dt.variation-Discount

{

display : none;

}

Here is a screenshot

The above discussed examples require PRO

Next Steps :

You may also want to check out these helpful guides :

Still unclear?

If you need any assistance, please create a support request at our ticket system. We are always happy to assist you :)

Did this answer your question?