How to Build a Global Checkout Using FunnelKit
Tavleen Kaur
December 24, 2020
Looking to replace your default WooCommerce Checkout page with a global Checkout?
The default Checkout looks bland, isn't mobile-optimized, and lacks elements that drive conversions. A custom Checkout-built for the storefront can change your game.
If you have a multi-product store where people come in add items to the cart and checkout, then having a custom-built global checkout will allow you to enhance the user's checkout experience.
You don't need to create several checkout pages for your different products.
This post will deeply dive into Global Checkouts and see how you can create one using FunnelKit (formerly WooFunnels).
Let’s dive in!
Contents
A Global checkout is the standard checkout that a customer sees after they add items to their cart and proceed to checkout.
Having a custom-built checkout instead of the default WooCommerce checkout ensures that all your customer’s questions are answered and they don’t feel anxious at any step of the checkout process.
The page needs to look credible for the users to make the payment without any doubts.
Global checkout applies to all the products on the website.
The default WooCommerce checkout meets the basic necessities of a checkout page but doesn’t allow the users any control over their purchase once they get to the checkout page.
On the other hand, the FunnelKit checkout page gives the users complete control over their cart and payment.
Before paying for products on the Global checkout page, you can view the images of the products to confirm that you’re buying the right items.
You can adjust the quantity of the products in your cart, delete the products, and even undo deleted items on the checkout page.
Testimonials displayed on the page also strengthen the claims of the offer. Bullet points about why they should buy from you and a guarantee seal just drive the point home even more.
FunnelKit has a collapsible order summary option that saves space on the screen for other details and form fields to be shown.
This is an age-old debate. Is a single-step global checkout better than a multi-step one? Or is it the other way around?
While a single-step checkout has all the required information available for the users to scan in one glance, a multi-step checkout breaks down the information into digestible chunks, making it easier for the customer to navigate.
If you are selling digital products, it has been noted that a single-step Checkout may work better for you simply because the form fields are lesser. You don't need a shipping method and address details from the user.
However, for physical products, a multi-step global Checkout can convert higher!
FunnelKit offers you a range of professionally built Global Checkout templates to replace the default WooCommerce Checkout Page.
Every template has a mini cart with a header, footer, a place for your company logo, and so much more.
Let's look at a few of our very popular and high converting Global Checkout templates:
As the name suggests, this template is designed very minimalistically with all the necessary elements displayed over a plain white background.
Different sections are separated by border and margin to make the global checkout page look clutter-free.
This page shows the checkout form parallel to the page's trust-building components, ensuring the customers of their purchase.
You can use the Minimalist template for your storefront by making a few customizations like changing the color of the header, brand color, and logo.
This Shopify style checkout template is one of our most loved checkouts.
You can view the order summary before making the payments, and in addition to that, even adjust the product quantities.
It is a very easy checkout page to navigate. And with a 'Why Buy From Us' section and guarantee seals, this page is very convincing.
The Classic global checkout template has a clean design that does not overwhelm the users.
The order summary shown right next to the checkout form gives the user a chance to modify and confirm the products before paying.
The 'Why Us?' section pacifies any doubt the buyer might have about the brand and convinces them about their purchase.
With a simple and convincing design, Classic is another popular Global Checkout template.
Apart from this, there are many global checkout templates available in FunnelKit such as Shoppe, Optic, Hific, and many more.
You can create and customize a Global checkout page for your WooCommerce store easily with FunnelKit.
This is how you can do it:
Purchase your copy of the Funnel Builder here.
Please note that the WooFunnels Funnel Builder is also available in the Lite (free) version as well. But we will be using the Pro version for setting up store checkout.
Once you have made the purchase, go to your WooFunnels account and download these zip files:
1. Funnel Builder (base plugin)
2. Funnel Builder Pro
Install and activate both plugins by uploading these zip files to your WordPress website.
Next, go back to your account and copy the activation code of the Funnel Builder Pro.
Then, paste the license key into the 'Settings' section of Funnel Builder and click on the ‘Activate’ button.
Hit the 'Save Changes' button when done.
Go to the 'Store Checkout' from your WordPress dashboard.
Next, click on the 'Create Store Checkout' button.
You'll be directed to import your global checkout templates.
Please note that 2-step signifies that the particular template will import two pages - a Checkout and Thank You page. While the 3-step template will import an additional One-Click Upsell page.
Furthermore, Funnel Builder deeply integrates with popular page-building tools such as Elementor, Divi, Oxygen, and Gutenberg.
If you want to use other page builders such as Thrive, Beaver, or any other, choose Others and create it with the help of shortcodes.
Select the page builder and click on 'Preview' on the template you want to import.
Next, make sure to choose the number of steps you want on your global checkout page and import the template.
Then, name your store checkout.
Enter the name of your store checkout and click on 'Add'.
Now, we will customize the look and feel of our store checkout.
Hit 'Edit' next to your checkout page.
After importing the template of your choice, click on the Edit button you customize the page in Elementor.
FunnelKit offers you two custom build widgets to optimize your checkout pages - Checkout Form and Mini Cart.
Design the page as you want - adjust the form field widths, enable progress bar at the top, and more.
In case you wish to add or delete any of the default checkout form fields, you can do that in FunnelKit.
In the Fields tab, you can add a new step, field, or section to the checkout form.
To re-arrange the fields and sections to your liking, drag & drop them around the page.
After that, click on 'Save Changes' once you’re happy with the structure of the global checkout form.
Optimizing your checkout form would ensure a smoother checkout experience for your customers.
Add checkout page optimizations like Google Address Autocomplete, Auto Apply Coupon, Express Checkout, Preferred Countries, etc.
First, click on the Optimization tab.
Enable all the optimizations you wish to add to your checkout page and click on Save changes when done.
Now, make sure to publish your store checkout from here:
That's it! You have successfully created your store checkout or global checkout funnel with the FunnelKit Funnel Builder.
However, if you're a FunnelKit standalone product - FunnelKit Checkout (AeroCheckout) user, then the process is simple.
If you're a FunnelKit Checkout (AeroCheckout) user, you have to mark a checkout page as 'Global' in the settings section.
Once you have a checkout page in place, you can mark it as global checkout.
Click on the FunnelKit tab in the sidebar, and choose the Settings option from the list.
Select the Checkout option to search and choose your checkout page to override the default WooCommerce Checkout Page.
From the dropdown menu, find and select the checkout page name you’d designed before to set it as the Global Checkout.
After that, click on Save changes to apply the page as a Global Checkout for all products.
With FunnelKit, you can add multiple complimentary offers - Order Bumps and One-Click Upsells - that would help you increase the AOV on every purchase.
An Order Bump is the offer made on the checkout page. It is often a low-dollar, impulse purchase that doesn't require a lot of explanation.
You can add more than one order bump on the same checkout page. And customers can add whichever bump they like to their cart by clicking on the checkbox.
Let's see how you can add a bump to your global checkout page.
To add a bump to the checkout page, click on Add Order Bump next to the checkout page.
A window would open, prompting you to name the order bump. Add the name you want and hit Add.
Click on the pencil icon next to the bump name to begin editing the page.
The first thing you need to do is add a product to the order bump.
Click on 'Add Product' to start.
Search for the product you wish to offer and click on 'Add Product'.
After you’ve added the product, modify the quantity and discount rate to make the offer more appealing.
Click on 'Save Changes' when you’re done.
Important: Only the products already added to WooCommerce can be searched for and added to the Bump.
To customize the page click on the Design Tab. Here you can change the Bump skin, Copy on the bump, color scheme, and more.
You can define when a particular order bump is added to the checkout page. Be it based on the order total, a specific product added to the cart, or something else.
This ensures that the additional offers are in line with the products being purchased.
Set these conditions under the Rules tab.
In case a single item is linked with multiple bumps, then priority decides which of those will get triggered.
Not only that, you can even set the priority of your order bumps from the Settings tab.
One-Click Upsells are the offers a customer sees after making the payment, and before landing on the Thank You Page.
The users can accept the offers made on these pages with just one click. They don't even need to enter their payment details again.
Let's learn how to design an Upsell offer for your Global Checkout.
Similar to the Checkout Page and the Thank You Page, the Upsell Page can also be added.
First, click on the 'Add New Step' button.
From the steps options, choose One Click Upsells and click on the template you like.
You'll be directed to the preview page. Here you can see the full preview of your upsell template.
Once you're satisfied with the design, click on 'Import This Template' and name your upsell offer.
Your upsell page step will get added to your global checkout funnel.
Click on the 'Edit' button to customize the upsell page.
The first thing you’d need to do is add a product to this offer and name it.
Then you’d need to add a product to the said offer.
Search and add the product you want to offer on the page.
Modify the quantity of the product and discount rates offered. Also, turn on the Offer toggle to apply it to the checkout page.
You can also add more than one offers. In addition to that, you can interlink them with Dynamic Offer Path.
On the acceptance or rejection of an offer, the customer will either be led to another offer or the thank you page, depending on the conditions you define.
Important: Only the products already added to WordPress can be searched for and added to create an Upsell offer.
Similar to the Global Checkout page, you can easily customize your upsell template.
Click on the 'Edit Template' under the Design tab.
FunnelKit offer 10 specially designed widgets for you to use and customize the Upsell Page with.
Drag & drop these widgets to the workspace and build the page to your liking. Click on the green Update button once you’re happy with how the page looks.
Just like with Order Bumps, here also you can set conditions for when to make a particular Upsell offer, and when not.
This is done from the Rules tab.
In Settings, you can choose if you want to merge the upsell with the main order or create a separate order for the upsell.
Not just that, you can set the priority sequence of the Upsell offers, among many other personalizations.
These settings, yet again, ensure a better checkout experience for the customers.
Click on Save changes to lock in all the changes made to the page.
You can even create and customize a Thank You page that follows this Checkout page after the purchase is complete.
Just follow the same steps as you did to build the Checkout Page, and you will have yourself a beautiful Thank You Page to complement the rest of the pages.
There you go! We've finally built our global checkout funnel.
A Global Checkout Page with FunnelKit (formerly WooFunnels) is designed to keep the users in mind.
These pages want to reassure and convince the customers of their purchase and make the whole process easier for them to maneuver through.
We saw how you can design a checkout page and apply as to all the products as a Global Checkout.
Not only that, but we also showed you how you can add additional offers that would help boost up the AOV with every sale.
With FunnelKit, you can create Checkout Pages with ease, and customize them to your liking.
Check out the FunnelKit Funnel Builder to learn more and build one for your business now!