A checkout that feels fine on a laptop can be painful on a phone. Tiny tap targets, a keyboard that covers the field you’re typing in, a surprise shipping cost on step three, a card form that won’t autofill. Each small friction is a chance for the shopper to give up.

Baymard Institute’s long-running research puts the average documented cart abandonment rate at around 70%, and a long or complicated checkout is one of the reasons shoppers give most often. You can’t fix every abandonment reason, but you can fix the ones inside your checkout. Here are twelve fixes, ordered roughly from quickest to most involved.

Start with a test run

Before changing anything, place a test order on your own phone, on mobile data rather than office Wi-Fi. Ideally, ask a friend with a different phone to do the same. Note every moment you hesitate, zoom, mistype or wait. That list is your personal roadmap, and it’ll probably overlap with the fixes below.

1. Cut the fields you don’t need

Every field is another thing to type with thumbs. Look at your checkout and ask of each field: do we actually use this to fulfill the order?

Common candidates to remove or make optional:

  • Company name (unless you sell B2B)
  • Address line 2 (keep it, but make it optional and collapsed where possible)
  • Phone number (keep it only if your courier needs it)
  • Order notes

In the WooCommerce Checkout block, you can control some of these fields directly in the block editor by selecting the checkout block and adjusting its settings. With the older shortcode-based checkout, you’ll typically need a checkout field editor plugin.

2. Use the right keyboard for each field

Phones show different keyboards depending on the field type. An email field should bring up the “@” key, a phone field a number pad, a postcode field numbers where appropriate. Modern WooCommerce checkout fields usually handle this, but custom fields added by plugins sometimes don’t. Tap through every field and check.

3. Make autofill work

Browsers and phones can fill names, addresses and cards automatically, which saves a lot of typing. Autofill depends on fields being labelled correctly in the code. If autofill fails on your checkout, the cause is usually a plugin or custom field with incorrect markup. Test it: if your phone offers to fill your address on other stores but not yours, it’s worth fixing.

4. Offer express payment options

Apple Pay, Google Pay and PayPal let a shopper pay with a fingerprint or face scan, skipping card entry and often address entry too. This is one of the biggest improvements available on mobile.

Most major gateways for WooCommerce support at least some express options, including Stripe, WooPayments and PayPal. Check your gateway’s settings, enable the ones available in your region, and make sure the express buttons appear at the top of the checkout (and optionally on the cart and product pages). For setup detail, see our guides to integrating Stripe and managing payment gateways.

5. Allow guest checkout

Forcing account creation before purchase is a well-known cause of abandonment. Under WooCommerce → Settings → Accounts & Privacy, you can allow customers to place orders without an account. You can still offer account creation after the order, on the thank-you page or by email, when there’s no purchase at risk.

6. Show the full cost early

Surprise costs at the final step are a frustrating experience on any device, and on mobile the shopper may not have seen the small print at all. Make sure shipping costs, or at least a clear estimate, appear on the product page or cart. If you offer free shipping above a threshold, show a progress message such as “You’re $12 away from free shipping.”

7. Make buttons big and obvious

Your “Place order” button should be full-width on mobile, high contrast and impossible to miss. Secondary actions, such as “Apply coupon” or “Return to cart,” should look clearly secondary. Check that nothing else on the page, like a chat bubble or cookie banner, covers the button.

8. Tame the coupon field

A visible, open coupon field sends some shoppers off to search for codes, and some never come back. Many stores collapse it behind a small “Have a coupon?” link. The WooCommerce Checkout block already shows the coupon field as a collapsed link by default.

9. Keep the checkout distraction-free

On a small screen, a full header menu, sidebar widgets and footer links push the important content down and give the shopper extra ways out. A simplified checkout header with just your logo, and a footer with only essential policy links, keeps attention on finishing the order. Many themes, including iConvert Themes, let you use a minimal header on checkout pages.

10. Show trust and policy information near the button

Shoppers on phones can’t easily open three tabs to check your returns policy. Put short reassurance near the order button:

  • Accepted payment methods (logos)
  • A one-line returns summary (“Free returns within 30 days”)
  • Expected delivery time
  • Secure payment note, if your gateway is a recognised name

Keep it short. A wall of badges looks less trustworthy, not more.

11. Speed up the checkout page

A slow checkout on mobile data feels broken. Common culprits:

  • Too many plugins loading scripts on every page, including checkout
  • Heavy tracking scripts and chat widgets
  • Unoptimised images in the header or order summary
  • Slow hosting or no page caching on the rest of the site (the checkout itself shouldn’t be cached, but faster hosting helps)

Run your checkout page through a tool like Google PageSpeed Insights, and try disabling non-essential scripts on checkout. Chat widgets, for example, rarely need to load there.

12. Handle errors gently

Validation errors are unavoidable, but they shouldn’t feel like a punishment. Good checkout error handling on mobile means:

  • Errors appear next to the field, not only at the top of the page
  • The page scrolls to the first error automatically
  • Messages say how to fix the problem (“Enter a 5-digit ZIP code”) rather than just “Invalid”
  • Nothing the shopper already typed gets wiped

Test this by deliberately entering a wrong postcode or an expired test card.

Should you switch to the Checkout block?

Since WooCommerce 8.3, new stores get the block-based Cart and Checkout by default. Stores that were set up earlier often still run the shortcode checkout. The block version was designed with a mobile-friendly layout, express payments and a collapsed coupon field built in, so it covers several fixes on this list without extra plugins.

The trade-off is compatibility. Some older plugins that add checkout fields or modify the checkout don’t work with the block version yet. Before switching, check each checkout-related plugin you use for block support, and try the change on a staging copy of your store first.

Quick-reference table

Fix Effort Typical tool
Remove unneeded fields Low Checkout block settings or field editor plugin
Correct keyboards and autofill Low to medium Plugin settings, developer help if custom
Express payments Low Payment gateway settings
Guest checkout Low WooCommerce → Settings → Accounts & Privacy
Show costs early Low Shipping settings, cart messaging
Big order button Low Theme or block styling
Collapse coupon field Low Checkout block or small plugin
Distraction-free layout Medium Theme template
Trust info near button Low Checkout block or theme
Page speed Medium Caching, script management, hosting
Error handling Medium Checkout block or developer

Recovering the shoppers who still leave

Even a well-built checkout will lose some shoppers to interruptions, comparison shopping or simple second thoughts. Two tactics catch many of them:

  • Abandoned cart emails. If the shopper entered an email address before leaving, a short reminder sequence can bring them back. Our article on writing cart abandonment emails covers the copy.
  • Exit-intent messaging on mobile. Mobile devices have no mouse to leave the window, so exit intent is usually detected from signals like fast scrolling up or tapping back. A gentle message offering to save the cart or answer a question can help, as long as it doesn’t block the checkout form itself.

iConvert Optimizer includes both abandoned cart recovery and exit-intent detection, but you can also combine a dedicated cart recovery plugin with your email tool.

Your mobile checkout to-do list

Pick up your phone and buy something from your own store. Then work through the fixes in order: remove fields, turn on express payments, allow guest checkout, and make costs visible early. Those four alone address many of the problems shoppers run into, and none of them needs a developer. Test again after each change, and keep an eye on your checkout completion rate for mobile visitors in your analytics.

If you’d like help recovering the carts that still slip away, iConvert Optimizer is built for exactly that.

It's easy to create website popups people will love.

Find out how to:
  • grow your lists, leads, and sales;
  • retain abandoning visitors;
  • create unique WordPress popups in minutes;
  • reach the right audience at the right time.

Setting up a WooCommerce online store can be hassle-free.

It's time to find out how to:
  • start your e-commerce business with WooCommerce
  • grow your store using marketing strategies
  • optimize your website using Analytics and A/B testing
Check these out

Comments are closed

Join the newsletter!