How To Make A Sales Funnel Website

SkyStra
Feb 21, 2021

Sales funnels are one of the most popular sales methods nowadays because they are an effective way to grow your sales and increase ARPU (average revenue per customer) on your website.

If you’ve never seen a sales funnel, here’s an example of one:

A sales funnel is another way to describe the ‘sales process’ from when an individual gets to know your brand, expresses interest in it, decides to buy and then ultimately goes through the action of purchasing and turning into a customer.

There are many types of sales funnels and this is just one simple example to give you an idea.

When you build a sales funnel into your website, you want to simulate the funnel ‘sales process’ to get customer to sign up, spend and stay loyal to your brand, products & services.

When it comes to sales funnels and your website, there’s a lot of different software options out there; however, it’s usually costly ($1000-$4000 range), and it’s completely separate from your website. It’s another thing that you need to manage and learn how to use, and it adds an unnecessary step in your workflow, not to mention a potential dent in your wallet.

Luckily, if you’re using WordPress and WooCommerce – this becomes much less complicated and cheaper. Both WordPress and WooCommerce are free and easy to use, and there are both free and premium sales funnels plugins to allow you build a sales funnel into your website. 

So, what do you need to build a sales funnel website?

Well, we’re glad you asked! 

To follow this article, you’ll need:

Preparation

Before we can start building our sales funnels, we need to install WordPress and several plugins. We’ll cover the details in this section.

Install WordPress 

If you’re a Skystra customer, you already have WordPress installed for you. However, if you want to build a sales funnel on a new website or just want to practice, please check this article for more information on how to add a new WordPress website to your account.

Install CartFlows

The next step is to install the sales funnels plugin. One of the most significant WordPress advantages is that it provides a healthy and extensive ecosystem of free and premium plugins you can use for various purposes. In this article, we’ve decided to use the CartFlows plugin as our sales funnel builder software. It allows you to build comprehensive sales funnels in a few clicks, and it doesn’t require any coding knowledge.

CartFlows has both free and premium versions, and the free version enables you to build unlimited numbers of sales funnels with custom-made checkout and thank you pages. If you want to use advanced features such as bumps, upsells, and downsells – you’ll need a premium version – CartFlows Pro ($199/year).

Let’s get started! 

Log in to your WordPress Dashboard, head to Plugins > Add New, fill in Cart Flows in the top-right search bar, and click Install Now:

Once installed, click Activate to activate the plugin:

Next, click Start Wizard in the top-left to configure the plugin. Setup Wizard allows you to configure the plugin in a few clicks.

Click Let’s Go to start the setup process:

Next, we need to choose which page builder we want to use with Cart Flows. The plugin supports multiple page builders out of the box:

  • Elementor
  • Beaver Builder
  • Divi
  • Gutenberg

In this example, we’ll select Elementor as it has a free version, and it’s easy to use. Cart Flows will automatically install and activate the page builder you choose once you click Next:

Once completed, Cart Flows will ask you if you want to install WooCommerce as your checkout system. 

Select Yes:

Finally, choose if you want to enroll in a free Cart Flows training course:

The setup is now completed, and you can click Exit Setup Wizard, as we need to configure WooCommerce next before we start creating flows (funnels):

Configure WooCommerce

Cart Flows installed and activated the WooCommerce plugin for you automatically; however, you need to go ahead and configure the store, set up payment methods, install the theme, and add your products. To learn more about how to set up WooCommerce, please check this article.

Creating A 2-Step Checkout Funnel

We’re now ready to create our first sales funnel! The first method we’ll explain is a 2-step checkout funnel, where the customer enters their billing details in step 1 and reviews/places an order in step 2. It’s a very effective checkout method and removes the order submission process’s complexity.

Head to CartFlows > Flows in your WordPress Dashboard, as this is where you can create your “flows” (also known as a funnel). Here you can create, import, and export your funnels.

Click Add New to start creating our first funnel, and you’ll see a list of premade templates for the page builder we chose (Elementor). Click View All Steps for each template you like, and it will show you a preview of the template and all steps that it contains.

Once you choose the template, click Import Flow to download the template:

Once the template is imported, you’ll see a list of the flow steps. Each step can be rearranged and edited using the drag & drop system, and you can add additional steps via the Add New Step button. The CartFlows Pro premium version also allows you to clone and remove steps.

As you can see, the Checkout Page has an orange warning – No Product Assigned, which means that you need to assign a WooCommerce product to it.

Click Edit next to the Checkout Page and then the Products tab. Click Add New product button, search for the product you want to link, and finally click Add Product:

If you have the Pro version, you can also apply a coupon and configure various product options.

Click Save Settings to save changes.

Next, click the Checkout Offer tab, and under the Checkout Skin drop-down menu, select the Two Step option.

Please note that you’ll need the CartFlows Pro version to change the checkout offer settings. Additionally, you can edit and rearrange the form fields as you like. Head to the Form Fields tab in your flow, and tick the Enable Custom Field Editor option. This will allow you to rearrange and hide/show specific fields.

Click Save Settings to save changes and view your checkout page to see the new and slick checkout experience!

If you want to change the design settings for the checkout page, tick the Enable Design Settings box on the Design tab:

Please note that every page created with CartFlows can be fully edited with the page builder you’ve chosen during the setup. Each element of the page is editable, so you can add/remove images, change the background color, background image, edit buttons, and text, etc.

Creating A Sales Funnel With An Order Bump, Two Upsells, One Downsell

Adding an order bump to your order form is a great way to entice your customers to spend more on your store. To add an order bump to your flow, edit the flow from CartFlows > Flows screen and click the Order Bump tab. Next, tick the Enable Order Bump checkbox to enable it.

Here you can add a product that you want to feature in your order bump and configure various options related to it, such as the discount type, discount value, the original price, and more. Click Save Settings to save changes when ready.

As you can see, it’s effortless to add order bumps to your existing orders!

Next, you can spice things up by adding upsells and downsells to your flow. 

The process is simple:

  1. Create the products you want to use as upsells and downsells via the Products > Add New option.
  2. Add any additional steps to complete your funnel by clicking the Add New Step button.
  3. Link newly created products to corresponding flow steps.

That’s it!

Creating A Lead Generation Funnel

A lead generation funnel means that your goal is to collect the contact details from leads instead of the direct financial gain. Create a new flow, click Start From Scratch, and give it a name:

This will automatically create three pages:

  • Sales Landing
  • Checkout
  • Thank you

Feel free to remove the Checkout page as we don’t need it for our lead generation funnel. Next, we’ll edit our Sales Landing page, and click the Edit with Elementor button:

You can build your landing page from scratch, or you can click the folder icon in the middle of the screen and select the free template:

To use the templates, you’ll need to create a free account with Elementor.

If you don’t like the contact form that comes with the template and want to use the custom one, you will need a Pro version of the Elementor plugin.

Drag & drop the form block to your page and edit it accordingly (you can add and remove fields, change the design, add the border, etc.). Finally, click the Content tab on the Edit Form screen, and expand the Actions After Submit section. Here, you define what happens once the visitor submits the form. Select the Redirect option under the Add  Action drop-down menu, and paste the URL of your thank you page.