ecommerce

Checkout

A checkout is the final stage of an ecommerce transaction where a customer reviews their order, enters payment and shipping details, and completes a purchase. In WordPress, checkout almost always...

Checkout

A checkout is the final stage of an ecommerce transaction where a customer reviews their order, enters payment and shipping details, and completes a purchase. In WordPress, checkout almost always means the WooCommerce checkout page — a single page (or multi-step flow) that collects billing address, shipping method, payment method, and order confirmation.

Quick definition: The checkout is the page or process where a store visitor becomes a paying customer. In WooCommerce, it’s controlled by the [woocommerce_checkout] shortcode or the dedicated Checkout block, introduced in WooCommerce 8.3.

What does the checkout page do in WooCommerce?

The WooCommerce checkout page collects everything needed to process an order: billing and shipping addresses, a chosen payment gateway, and optional fields like order notes. On form submission, WooCommerce validates the data, charges the payment method, creates an order record in wp-admin → Orders, and redirects the customer to a thank-you page. We see this flow on every client site we manage, and it runs on the same page every time unless you deliberately split it.

Why checkout performance matters

Cart abandonment at checkout averages 70.19% across industries, according to the Baymard Institute’s research on 49 studies. Most of that abandonment happens because the form is too long, the page loads slowly, or unexpected fees appear. On shared hosting, we’ve measured WooCommerce checkout pages loading in over 4 seconds — enough to push that abandonment rate higher. Switching to a host with server-side caching (or adding a plugin like WP Rocket) consistently brings that under 2 seconds.

How to customize the WooCommerce checkout

WooCommerce gives you three practical options:

  1. Block-based checkout — Available since WooCommerce 8.3, this is the default for new installs. Drag fields in the Site Editor; no code required.
  2. Shortcode-based checkout — The legacy [woocommerce_checkout] shortcode, still used on sites that haven’t migrated to blocks. Customizable via woocommerce_checkout_fields filter or a plugin like WPForms.
  3. Page builder checkout — Elementor Pro includes a WooCommerce Builder that lets you redesign the checkout template visually; useful for client sites where design consistency matters more than default styling.

On client builds, we default to the block checkout for new projects — the handoff is cleaner because clients can adjust field labels without touching code.

Common checkout problems and fixes

  • Checkout page blank or showing 404 — The checkout page was deleted or the shortcode was removed. Go to WooCommerce → Settings → Advanced and reassign the correct page.
  • Payment gateway not showing — The gateway plugin is inactive, or the store currency doesn’t match the gateway’s supported currencies.
  • Checkout fields not saving — Often a caching conflict. Ensure your caching plugin excludes /checkout/ from static caching.
  • Cart — the staging area before checkout where items are held
  • Payment gateway — the service that processes the transaction at checkout
  • Order — the record created when checkout completes successfully
  • WooCommerce — the plugin that adds checkout functionality to WordPress
  • Thank you page — the confirmation screen customers land on after checkout

Additional reading:

Last verified: April 2026

Back to Glossary