Would you like to replace the default WooCommerce checkout with something more polished? The Checkouts module in Merchant Pro lets you swap the standard checkout page for one of three custom designs built to convert.
In this guide, we’ll walk you through how to configure and enable the Checkouts module in Merchant Pro.
Before you get started, make sure you’ve installed and activated the Merchant plugin on your WordPress site. If you’re using premium modules, ensure you have Merchant Pro installed and active. This feature requires Merchant Pro.
The module gives you three custom checkout designs to choose from: Shopify multi step, One step, and Multi step. Here’s the default WooCommerce checkout page for comparison:
Merchant Pro’s custom checkout designs
Let’s look at the three designs you can choose from.
Option 1: Shopify multi step
The Shopify multi step checkout style is inspired by Shopify’s layout. It breaks the checkout flow into three steps:
- Cart (this step takes the customer back to the Cart page)
- Information
- Payment
It also displays a stylish order summary with product images, giving customers a visual cue of what they’re about to buy:
Option 2: One step
The One step checkout style shows everything, including payment details, on a single page. Like the previous design, it displays a stylish order summary with product images above the totals box:
Option 3: Multi step
The Multi step checkout style breaks the process into three steps:
- Billing & Shipping
- Order & Payment
- Order Review
It shows the steps on a clickable progress bar above the checkout form, so customers always know where they are and can jump back to a previous or next step to make changes:
1. Open the Checkouts module
First, open your Merchant dashboard by clicking the Merchant menu in the left sidebar of your WordPress admin area. Find the Convert More section, and click the Checkouts module to open its settings page.
2. Choose a checkout design
On the module’s admin page, you’ll find the three checkout designs. The Preview box shows a screenshot of each style as you click through the options. For the Shopify multi step and One step layouts, you also get a Sticky Totals Box option that pins the totals box to the top of the page as the customer scrolls.
Select the checkout style you want, then click the Save button in the top-right corner of the page:
3. Enable the module
To activate the Checkouts module, click the Enable button at the top of the page.
Frequently asked questions
Below, we’ve answered some of the most common questions about the Checkouts module.
Can I switch checkout designs later?
Yes. Return to the Checkouts module any time, select a different design, and click Save. The new layout applies right away.
What is the Sticky Totals Box option?
It keeps the order totals box pinned to the top of the page as the customer scrolls. It’s available with the Shopify multi step and One step layouts.
That’s it! You’ve successfully set up the Checkouts module in Merchant Pro and applied a custom checkout design to your store.
Next, would you like to translate the text on your new checkout? Check out our guide on translating Merchant with Loco Translate to learn more.
