WooCommerce Upsells: How to Create Post-Purchase Offers that Boost AOV

Tavleen Kaur
February 21, 2021

WooCommerce Upsells and cross-sells are a great way to boost your average order value. But having the right strategy in place and not interfering in user's purchase flow is the key to more conversions.

Pre-purchase cross-sells often confuse users with too many options, resulting in cart abandonment.

Thus, post-purchase upsells are relevant and timely. The users can accept them with a single click without going through the whole checkout process again.

This post will talk about how you can create post-purchase WooCommerce Upsells for your website.

Now without any more delay, let’s get started!

What is a One-Click Upsell?

To increase the order value of a sale, you can make various offers to your customers. These offers are called Upsells.

Post-purchase upsell offers perfectly complement the primary purchase, and that is what makes them hard to reject.

This is how a typical WooCommerce upsell page looks (Persuader template for Elementor, by WooFunnels):

WooCommerce-Upsell-Christmas-Socks

A convincing image with a short, interesting copy that explains the product is what sells it. Add to it some testimonials, and you've got yourself an attractive and high-converting upsell.

Why Do You Need One-Click Upsells?

WooCommerce upsells for post-sale can increase your revenue by 35% on average.

One-Click Upsells help with:

  • Higher Average Value: By making relevant and well-timed offers, you increase the chances of closing each purchase at a greater order value.
  • Better Customer Experience: Users discover products that they may not have known about before. Also, offering them the power to accept or reject the offers with a single click makes it even better.
  • Better Return on Ad Spends: One-click upsells or post-purchase WooCommerce upsells help you generate more profits for your ad spends.
  • Personalized Experience: Tailor out the upsell offers based on the items bought, past purchases, order total, and more. This ensures that each customer gets personalized suggestions.
  • Customized Funnel Path: Strategically linking and showcasing offers based on the customer-behavior in real-time, gives a sense of control and personalization to the users when shopping.

" I knew that AOV is the most important metric for a business and pop-ups & all kinds of tactics - but nothing really worked. The opposite happened & there was a decrease in my conversion rate.

After WooFunnels, we are seeing a 40-50% increase in our AOV.

That's more than I could ever imagine."

Tom Hoah
Serial Entrepreneur

Now let’s see how you can add WooCommerce Upsell offers using WooFunnels.

Preparing to Set Up an Upsell: Adding a Checkout Page

Setting an upsell is easy but as upsells follow after the checkout page and precede the thankyou page, let’s first see how we can set us a groundwork that adds to the WooCommerce Upsell conversions:

Step 1: Add a Funnel

Let's now add a new funnel to your WordPress website.

First, go to WooFunnels > Funnels from the WordPress menu, and click on the Add New button.

Add-New-Funnel

You have two options now - to import a pre-built template or build a custom funnel.

We would choose the “Create Your Funnel” option instead so that we can add the steps we want.

Create-Your-Funnel

Step 2: Add Steps 

Now that we have a blank funnel, let's add our preferred steps to it.

Click on the “Add New Step” button to add the first step.

Add-New-Funnel-Step

Choose the Checkout step as the Upsell page appears after moving from the checkout page.

Add-New-Step-Checkout

Note: You can add the upsell offers to your existing Global checkout as well, but if you are creating a funnel, we would recommend you to add a Checkout page to it.

Next, you’d be prompted to name the page. Name it and hit create.

Name-Checkout-Page

Similarly, add a one-click upsell page and a thank you page.

WooCommerce-Upsell-Funnel

Step 3: Add Product to the Checkout

The checkout page can either be product-specific or a global checkout.

Here we would add a product to the checkout. For that, click on the pencil icon next to the page name to begin.

Checkout-page-edit

Click on the product tab from the top and click on Add Product.

Add-Product-Checkout

Choose the product you wish to add from the search box and click on add.

Search-Checkout-Product

Manage the quantity and discount you want to offer on the page and save changes.

Checkout-Product-Discount

Step 4: Customize the Checkout Page

Next, we will import a checkout page template and customize it.

WooFunnels deeply integrates with Elementor and Divi, and also provides you with pre-built templates in one, two, and three-step formats.

You can even design the page from scratch using the Elementor widgets.

In this case, we will be using the Elementor templates. Select the template you want and import it with one click.

Import-Checkout-Template

We have a post that tells you all about the customization of Checkout pages in Elementor to make it more converting for your business.

You can check it out by clicking here.

Step 5: Customize the Thankyou Page

Like the Checkout and Upsell page, you can either import the page template you like or create it from scratch. We imported an Elementor template here.

Thankyou-Page-Template-Import

Like with the checkout page, we have a whole other blog post that teaches you to create a high-converting thankyou page.

How to set up a Post-Purchase WooCommerce Upsell

Now that we have the checkout and thank you page in place, we will show you how you can design the best one-click upsells for your online store.

Follow these steps to add an upsell to your WooCommerce store:

Step 1: Create an Upsell Offer

An upsell offer pitches products either at a discounted rate or in a bundle to attract customers.

To add products to your upsell click on the pencil icon to open the editing window.

A sample offer is already added to the page. You just need to add a product to the offer.

Click on the Add Product button to begin.

Add-New-Product-WooCommerce-Upsell

Select the product you wish to add from the search bar and add it to the page.

You can even lookup and add products with color or size variants.

Add a discount to the product price, change the quantity you wish to offer, and hit save changes.

WooCommerce-Upsell-Product

Step 2: Configure the Settings

Under the add product, you’ll see a section of settings that gives you various options to optimize your offer.

WooCommerce-Upsell-Settings

You can choose to implement one or all of these options - 

  • Dynamic Shipping: This option would charge the customers separately to ship the upsell offer they accepted.
  • Ask Confirmation: On accepting the offer, a side window would open asking for a confirmation. This is to ensure that nobody accidentally accepts the offer.
  • Skip Offer: To skip an offer if the customer, has it in their order, or if they’ve bought it before.
  • Add Tracking Code: To track if a user has purchased a product so as to not show them re-targeting ads of the same.
  • Quantity Selector: To let users choose the product quantity. Click on the checkbox and add the Quantity selector widget to the upsell page.
  • Terminate Funnel: Terminate the funnel and direct the users directly to the Thankyou page whether they accept or reject this offer. 

Sweeten the Deal Further: Add More Upsells to Your Funnel

You can direct users into an upsell funnel where you can make more offers after they accept/reject the previous one.

Add more than one offer to your upsell and make both offers live by clicking on the toggle.

WooCommerce-Upsell-Offer-Live-Toggle

When you have more than one offers in your funnel (like in the image above), you can see settings for Dynamic Upsell Path:

Dynamic-Upsell-Path-Offer-Linking

Dynamic Offer Path allows you to link the Upsell offers with one another, based on the customer’s behavior of accepting and rejecting the previous offers.

This allows you to analyze your users’ interests and tailor the offers for them on the fly.

Note- The Dynamic Offer Path allows you to link the offer you're on with the next offer in the funnel. The acceptance or rejection of the last offer inevitably leads the buyers to the thank you page.

Step 3: Customize your WooCommerce Upsell Page

Like the Checkout page, you need to import a template of your choice to customize it.

From all the template options available in Customizer and Elementor, import the one you like.

WooCommerce-Upsell-Template-Import

Then hit the Edit button to customize the page in Elementor.

Change the copy of the page from the Content tab. The color and typography can be altered from the style tab, among the other changes.

Upsell-Template-Customization-in-Elementor

10 special widgets are available to make your Upsell page more attractive and user-friendly.

Upsell-Widgets-in-Elementor

Customizing the prices shown to make the offers look more enticing is also possible.

Click on the offer price and go into the Style tab. From here you can add a label to the original and discounted prices.

You can also hit the stack toggle to display the prices stacked one over the other.

WooCommerce-Upsell-Price-Customization

Change the color, alignment, and more to make the page look attractive and on-brand.

When you’re all done, click on the Update button to lock in all the changes made.

Adding Multiple Products to One WooCommerce Upsell Offer

You can have more than one product showcased on the same WooCommerce Upsell page. The customer would have the option to choose the product they want to purchase, if any, and make the final payment.

This is how you can add offers like that to your funnel:

Step 1: Add a new product

You will spot an "Add Product" button right under the already added product details on the WooCommerce Upsell offer you created before.

Add-Product-to-Same-Upsell-Offer

Click on that button to then look up the desired product and add it to the page. Then, customize the discount and quantities you want to offer.

Multi-Product-Upsell-Offer-Quantity-Settings

Once done, click on save changes

Step 2: Import a New Template

In the Design tab, this time, you have the option to import a multi-product upsell page template in Elementor. Pick the design you like and hit import.

Multi-Product-Upsell-Template

Step 3: Customize the Template

After importing the template, click on the Edit button to begin customizing it in Elementor.

Edit-Multi-Product-Upsell

The customization options and widgets remain the same whether you are editing a single product page or a multi-product page.

Change the text color, typography, images, copy, and more to make the page reflect your brand image.

Multi-Product-Upsell-Template-Customization-in-Elementor

Click on Update to save changes when done.

Global Upsell Settings

Some more settings that can help you optimize your WooCommerce Upsell pages and make the experience better for the users.

Click on the settings tabs on the navigation bar up top.

WooCommerce-Upsell-Global-Settings

Here you can select how you wish your orders to be shown and billed.

  • Behavioural: You can add the Upsell order to your main order or have it as a new separate order.
  • Priority: If more than one upsells is active and fits a particular order, this priority number decides which upsell would be triggered. #1 has the highest priority.
  • Prices: Do you wish to show the prices with or without tax can be determined from here.
  • Confirmation Messages: You can customize the messages that are shown to the user when there is an upsell success, failure, or if the offer is still processing.
  • External Tracking Code:
  • Thankyou Page: You can customize a thank you page outside this funnel builder and link it here with NextMove.

Excited to Add WooCommerce Upsells to You Arsenal?!

Now, wasn't that easy?

WooCommerce Upsells help a lot in increasing your store's order value, and with WooFunnels you can design pages that are sure to convert.

"Upsells account for more than 15% of our annual revenue now, and 40% of those upsells are a direct result of the Funnel Builder.
WooFunnels breathes new life and revenue into new and existing businesses!

Get it Today!"

Griffin Stewart
CEO & Co
5DayDeal.com

Just like Griffin, you can also have a higher revenue rate with easily customized and conversion-optimized WooFunnels Upsells.

WooFunnels has a deep integration with Elementor, making your job of designing funnel pages a breeze.

Create your WooCommerce Upsells without much effort in WooFunnels Funnel Builder today, and experience a boom in your business revenue!

Author: Tavleen Kaur
Do you know after Amazon implemented the 1-click buy system, their sales shot up year-on-year hitting $88.9 Billion mark in 2014? Jeff Bezos attributed it to a friction-free & streamlined buying process. At BuildWooFunnels, we're determined to give you the tools you need to do the same in your business. I am Tavleen and I help you get there faster.

Increase your sales, starting today.

Get WooFunnels Now
chevron-down