Optimizing the Checkout Flow with WooCommerce

Written by Nicole Kohler on January 18, 2018 Blog, Taking Payments.

Everything you do on your store leads your shoppers to one final, critical experience: the checkout. And this final experience is so important, yet so sensitive, that one wrong move could send those potential sales down the drain.

It’s crucial to get your store’s checkout “flow” — the transition between one field or page to another, from the start to the finish — as smooth as possible to avoid losing sales. The default WooCommerce checkout goes a long way toward making this happen, but depending on your store, industry, or products, there’s still more that could be done to make the process simple and pain-free.

Let’s take a look at how you can optimize the checkout experience for your shoppers, from removing excess fields to opening terms & condition links in new tabs.

How the default checkout flow in WooCommerce helps you succeed

By default, the WooCommerce checkout is designed to be as smooth as possible for your customers. With a theme like Storefront, you’ll be presenting a simple, clean experience that serves as a strong final touchpoint for everything else you aim to do with your store.

One of the best features of the default checkout is the minimal display of fields. From the cart you proceed immediately to a single page where the billing and shipping information is requested, and the order summary is presented one last time. It saves time and reduces distractions.

Also, if you offer multiple payment or shipping options, the checkout immediately toggles between the appropriate text, pricing, and button text without any lag or wasted space.

WooCommerce toggles between payment options quickly, and adjusts the button text displayed to match.
WooCommerce toggles between payment options quickly, and adjusts the button text displayed to match.

This sets expectations right away, so a shopper who chooses to pay with PayPal knows they’ll move off your store to process their payment, while another who chooses a different option will know what’s coming next.

The checkout will also be as long or as short, or as complicated or simple as you want it to be, depending on what you select in setup. If you only ship your products to the United States, you can easily select that country as the one you restrict shipments to — and eliminate all other options, saving customers time and hassle.

Now customers won't have to waste time picking their country.
Now customers won’t have to waste time picking their country.

When you might want to deviate from the defaults

Although the default WooCommerce checkout creates a solid, flexible, and streamlined experience right out of the box, it might not be perfect for your store.

Different industries, stores, and products merit different checkout experiences, and thus, deviances from the default fields, pages, and options. Though anyone can set up WooCommerce and get a store running with a beautiful checkout in just a few minutes, it might take a little longer to get a checkout that is both beautiful and optimized.

Ready for checkout? WooCommerce and Storefront present a clean, easy-to-use experience -- for free.
Ready for checkout? WooCommerce and Storefront present a clean, easy-to-use experience — for free.

As an example, if you sell products that are personalized or have any kind of detail chosen by customers, your shoppers will be far more careful about the items they’ve chosen, and much more likely to double-check their specifications at the last moment. A quick checkout that rushes them through the final steps and omits those details might be seen as a negative experience.

Want to create additional personalization options for your products? Get Product Add-Ons for gift messages, donations, laser engraving, and more!

Consider also products that are likely to be business purchases, like laptops or desktop computers. A streamlined checkout that glosses over the details or obscures the pricing could be viewed as problematic, especially if it needs to be submitted as an expense.

Before making any changes to your checkout, you should think carefully about whether your customers are likely to want to speed through checkout… or if, like the examples above, they’re more likely to crave those little details.

One page vs. multi-page: think less about the page count and more about the flow

One page checkouts are popular, and often said to increase conversions over multi-page versions due to their simplicity, but no one can say for sure which is “better.” Just like guest checkout (which we’ll touch on in a bit), one store might see orders go through the roof with a one-pager, while another might see sales plummet.

Why? Well, the truth is that it’s not really about the number of pages. It’s about the signals you’re sending to shoppers. A one page checkout can be just as tedious as a multi-page checkout if it contains unnecessary fields, annoying questions, and distractions.

A short checkout can be just as tedious as a long one, depending on what you’re asking customers to do.

Look out for the following potential issues that might hurt a customer’s checkout experience and disrupt the “flow” from one field to the next:

  • Lots of unnecessary fields (middle name, title, multiple lines for address, order notes…)
  • Unnecessary re-confirmations or reminders of products, pricing, or any other information already entered
  • Links to other pages — many checkouts are missing the rest of the store’s navigation so that shoppers aren’t distracted
  • A demand to create an account instead of allowing guest checkout

Finally, if your checkout is broken into multiple pages, you might consider adding a visual indicator of the shopper’s progress, which could make them worry less about how much they still have to do to place their order.

Even though their checkout is technically only one page, this is something you can see in action once you leave the Xero Shoes shopping cart:

"You're one step away from finishing," visual indicators like these say.
“You’re one step away from finishing,” visual indicators like these say.

This has the effect of changing a shopper’s perception from “ugh, how long until I can order my shoes?” to “oh, just one more step until I can order my shoes!”

Eliminate unnecessary fields to speed up the process

Depending on what you sell in your store, you might not need half of the default fields in the WooCommerce checkout. Perhaps you don’t ship any physical goods, because they’re picked up from a local bakery. Or maybe all your items are digital downloads.

This means you should consider eliminating any unnecessary fields to speed up the checkout process for your shoppers. No one wants to fill in their shipping address if their product isn’t shipping, after all. So why not just turn those off completely?

There’s an easy way to alter the fields displayed at checkout without digging into code: the Checkout Field Editor extension. Upon activation, this extension will add a menu to WooCommerce where you can rename, edit, or remove any and all fields from the default checkout.

The Checkout Field Editor does what it says on the box: it lets you edit the fields displayed at checkout.
The Checkout Field Editor does what it says on the box: it lets you edit the fields displayed at checkout.

Of course, it goes both ways, too. If you need to add a field, or simply make a typically optional field required, you can do so in a matter of moments. Let’s say your store offers local pickup, and you want customers to specify the date they’re dropping by. You can add a date picker field, make it required, and voila:

Now your checkout is both streamlined and giving the customer what they need to get their order on time.
Now your checkout is both streamlined and giving the customer what they need to get their order on time.

One note of caution: removing default checkout fields has the potential to interfere with the styling and behavior of some WooCommerce themes, so keep an eye out. Also, if your products aren’t shipping, you can turn that option off entirely via a global setting rather than removing the fields — it’s a little easier. 🙂

If further detail is needed, make it available — without sending the shopper away

Some products are complex, require a ton of information, or have pages packed with photos. But even with all this detail added, there are times that you have to add more at checkout. Maybe you sell borderline dangerous hot sauces, and need to warn your customers that they might burn their mouths, or remind them that you’re not responsible for any injuries.

It’s certainly important to get these last-minute reminders and agreements in, but adding distractions to the checkout flow is a bad idea. Links that take a shopper off the final page can potentially completely ruin a sale if they’re distracting enough.

The best way to offer important, last-minute information while preserving the checkout flow is by adding links to content that opens in a new browser tab. You can do this easily in WordPress’s visual editor by selecting “Open link in new tab” on the Insert/edit link screen.

Need to add terms, FAQs, return information, or even a warning at checkout? Put the content elsewhere and add links that open in a new tab so your customers don't abandon their carts.
Need to add terms, FAQs, return information, or even a warning at checkout? Put the content elsewhere and add links that open in a new tab so your customers don’t abandon their carts.

This way, if a shopper needs to check out your return policy, realizes they need to read your FAQs, or even has to agree to terms & conditions or a safety warning before purchasing (hey — ghost peppers really are hot!), they can do so without potentially abandoning their cart.

On the topic of customer accounts, choose carefully

Required user accounts are right for some stores, but a hindrance to others. If you sell digital downloads tied to an email address, have memberships, or serve customers likely to order frequently, it certainly makes sense to ask for a signup prior to ordering.

Otherwise, guest orders — and guest checkout — will do just fine. Asking a customer to stop what they’re doing to sign up is not only a huge interruption, it’s annoying. And for some shoppers, that’s enough to send them in the direction of another store.

If you don’t want to force shoppers to create an account, but still want the option to be present, you might consider adding a “create an account to store your information for next time” prompt either before or after checkout is complete. This keeps the process moving along, but also offers the chance for accounts to be created and customer information stored.

An optimized checkout leads to more completed orders

Much like everything else in eCommerce, not every default setting or best practice will be right for every store. If you have certain products, or even specific shipping methods, you’ll need to optimize your checkout for best results.

Have any questions about optimizing your checkout experience for fewer interruptions, happier shoppers, and more completed orders? Leave them in the comments below and we’ll be happy to help you out.

6 Responses

  1. Justin
    March 30, 2016 at 12:48 pm #

    Hi – I saw that Shopify had a couple of big announcements at Unite (https://www.shopify.com/blog/113982149-here-s-everything-we-announced-at-unite-and-what-it-means-for-you-as-a-merchant) – was wondering what was in the pipeline for WordPress

  2. Keir
    April 8, 2016 at 2:36 pm #

    Great article. But boy I sure wish I could get your Amazon S3 plugin to work. Without it working then there is no workflow that will improve things . I have now been waiting 5 days to get any kind of real help getting it working, and this seems to be the only place where I can give any kind of feedback. Can you possibly wake up a ninja for me? They seem to be sleeping. Thanks!

    • Nicole Kohler
      April 9, 2016 at 3:34 am #

      Hey Keir, pass along your ticket number and we will take a look if you are still waiting. We realize support times are not where they need to be and we are certainly working on them. 🙂

  3. Scott
    April 14, 2016 at 6:00 pm #

    Great article Nicole, I agree with all of these points. I wrote an article on improving the checkout flow for mobile, which comes with it’s own unique considerations. Here’s the link if you’re interested: https://apppresser.com/lets-make-woocommerce-checkout-better/


  4. Tom
    April 15, 2016 at 12:13 am #

    I agree that Guest checkout needs to be easy, and about 70% of our purchasers go that route. For that very reason, the Reports capabilities of WooCommerce needs to be much more robust and not treat Guests as second class. As it is, for most detailed sales reporting you’re only a “Customer” in WooCommerce’s eyes if you do set up an account, but in our real world everyone who buys our product is a valued customer. We’ve tried a couple plug-ins (Woocustomers, CSV Export, Zapier) to help facilitate this, but found nothing yet that makes it easy – and it really needs to be easy. Any suggestions or hints at future upgrades are welcomed, thanks.

  5. ELEVEN velo
    April 15, 2016 at 12:48 am #

    Out of the box, the woo checkout is not great in terms of mobile responsiveness. We needed to go find additional code to make it closer to what we consider to be ‘mobile friendly’, something I think would be out of reach of the ‘average code un-savvy’ woo user.

    As Scott mentions quite well in his article, I think this is one area that needs a lot more attention for near future developments.

WooCommerce - the most customizable eCommerce platform for building your online business.

  • 30 day money back guarantee
  • Support teams across the world
  • Safe & Secure online payment
%d bloggers like this: