How to create a WooCommerce upsell funnel without a plugin

You can create a WooCommerce upsell funnel without a plugin in next to no time with only a few dozen lines of code and creativity

Upsell funnels with WooCommerce, as with most platforms, are extremely popular. They present the store owner with an opportunity to increase the size of their cart with special offers or one time deals. But to do this you often need a plugin, and in many cases a premium plugin. But did you know that you can do it with a few dozen lines of code in your functions.php file and your standard blocks editor? Let’s show you how

Step 1. Create a standard page

Go to add new page and start building a new page. Give it a simple name such as upsell. Be creative and include images, offers or anything that you like on this page. The idea is to use this page as a product upsell opportunity.

When creating this page you want to include a few key elements.

1. Offer title
2. Offer image
3. Offer price
4. Add to cart button
5. Skip to checkout button

Example of an upsell

To create the above page you don’t need a fancy page builder, even the blocks editor can help you achieve this layout.

To add the add to cart button on the page you’ll need to use a shortcode. You can find a list of all WOoCOmmerce shortcodes at this link. For The add to cart button you’ll want to use something like [add_to_cart id=”99″]. This shortcode will add an add to cart button for the product with ID of 99 to the page.

If you are stuck for ideas you can even use a WooCommerce blocks item and display a selection of products such as items on sale, newest or best sellers.

The skip to checkout button should include a direct link to the checkout eg. yoursite.com/checkout/. Ideally, place it at the bottom under the offer.

Step 2. Add the code

To get the free WooCommerce upsell funnel without a plugin working we need to add some code to our child theme functions.php file. Don’t worry if this is the first time you’ve done it. If you’re careful everything will be fine.

First we need to redirect the cart link to the new page, but avoid that redirect on the checkout or new page which we have just created. Enter the following into the theme functions file

// REDIRECT CART TO A NEW PAGE
 add_filter( 'woocommerce_get_cart_url', 'swift_filter_get_cart_url' );
 function swift_filter_get_cart_url( $url ) {
     if (is_page( 'upsell' ) || is_page( 'checkout' ) ) {
     $url = wc_get_checkout_url(); return $url; 
     } else {
     $url = 'https://yoursite.com/upsell/'; 
     return $url; 
     }
 }

Remember to replace yoursite.com with the url of your website

What’s happening here? In this block of code we are filtering the redirect of the cart page url to a new url with a condition.

The first if statement detects if it’s either the upsell page or checkout page and if it is to redirect to the checkout page.

The else statement tells it to redirect to the upsell page if the user is not on the upsell or checkout page

Next, we want to change the default add to cart text on the upsell page. People are already buying, so saying add to cart isn’t as subtle as add to order. You can skip this step if you wish, but it’s a nice touch

// CHANGE ADD TO CART TEXT ON THE UPSELL PAGE
 add_filter( 'woocommerce_product_add_to_cart_text', 'swift_woocommerce_custom_product_add_to_cart_text' );  
 function swift_woocommerce_custom_product_add_to_cart_text() {
         if (is_page( 'upsell' )){
     return ( 'Add to order', 'woocommerce' );
         } else {    
     return ( 'Add to cart', 'woocommerce' );
         }
 }

What’s happening here? This is a simple change of text rule, but with a condition

The if statement detects if the page is the upsell page. If it is then it instruicts the website to change the add to cart text to add to order,

The else statement says that on all other pages to change the add to cart text to add to cart. Note. You can change the text to anything. If you change the else statement to add to bag it will appear as add to bag on every page except the upsell page. You have a lot of options with the above code

At this point your free WooCommerce upsell funnel without a plugin will be working almost perfectly, but you need to do a few more things. If you were to enter the checkout page with an empty cart you would create a redirect loop. We don’t want that, so we’ll add a final block of code to solve it

// REDIRECT IF CART IS EMPTY
 add_action( 'template_redirect', 'swift_cart_empty_redirect_to_shop' );
 function swift_cart_empty_redirect_to_shop() {
   global $woocommerce, $woocommerce_errors;
 if ( is_checkout() && sizeof($woocommerce->cart->cart_contents) == 0) { 
         wp_safe_redirect( get_permalink( wc_get_page_id( 'shop' ) ) ); 
      exit;
     }
 }

What’s happening here? In this block of code we’ve declared that if the user is on the checkout page and their cart is empty then to r=create a safe redirect to the shop page. Pretty simple.

At this point, your WooCommerce upsell without a plugin is working nicely. To finish it off remove every instance of a direct link to the cart page from your website frontend, eg. menu. This will force them to use the upsell funnel instead.

One benefit of this upsell funnel is that you can chain together an entire upsell flow. You can add 2, 3 or even 9 pages and link them together one after another to create a big funnel which can increase the size of your cart.

If you get creative you can expand the code to add the cart page to the checkout, create rules which will redirect to different pages depending on which products are in the cart and so on. This free code snippet can set you on a journey to upsell greatness