Browse by Topic

Optimized One-Page Checkout (Early Access)

Optimized One-Page Checkout is BigCommerce’s new checkout and order confirmation page. It includes features that reduce friction and improve the overall flow of checkout to increase sale conversions.

 

This feature is currently in early access. There are a few features and payment gateways that are not yet implemented. See the Limitations of Early Access below.

Responsive, minimal design
  • Persistent cart means that customers can quickly access and edit items in their cart throughout the checkout process.
  • The responsive, minimal design lets customers comfortably check out on any device, without distractions.
User-added image

Simplified Shipping Address Entry
  • The default country in the dropdown is based on the customer’s IP address and only includes countries which have been set up in the Shipping Manager.
  • Lowest priced shipping option selected by default, so customers can go right to the next step if they so choose.
User-added image

New Credit Card Box
  • Text fields are optimally laid out, clearly labeled and include security icons to instill trust.
  • Card type is auto-detected when the credit card number is entered, removing that extra step.
  • Checkout will display the shopper's selected currency
User-added image

Improved Checkout Flow
  • Returning customers are automatically sent to the payment step with their billing and shipping automatically filled.
  • After guest checkout, the option to create an account is available on the Order Confirmation page.
 

Did you know? The order confirmation (thank you) page will use the admin email address found in Store SettingsMiscellaneous, and the phone number listed in the Store Profile.

Order Confirmation page

Limitations of Early Access

The Optimized One-Page Checkout beta has the following limitations:

  • Multi-Destination shipping is not supported
  • Affiliate tracking code is not supported
  • Invoice emails will display with the store's default currency
  • Payment Gateway listing is set to be alphabetical; it cannot be changed

Payment providers are limited to:

 

Did you know? If you use multiple payment gateways and one of them is not in the list above, then checkout will use the current single-page checkout instead of Optimized One-Page Checkout.

Opting into Early Access

If you are interested and use the appropriate payment gateways, you will be able to participate in this early access version of Optimized One-Page Checkout.

1. Go to Advanced Settings › Checkout.

2. You should see a splash screen asking you to participate in the early access. Click the Try new checkout button.

3. If your store is using the appropriate payment gateways, it will successfully apply the new Optimized One-Page checkout.

Turning Off Early Access

If you want to return to only using the Legacy Single Page checkout, you can within the control panel.

1. Go to Advanced Settings › Checkout.

Checkout Settings

2. Under Checkout Settings, select One-Page checkout or Custom one-page checkout.

Customizing Checkout

Some light style customizations can be made to the Optimized One-Page Checkout if you are using a Stencil theme. The Stencil Theme Editor has an Optimized Checkout section where you can change fonts and colors, or add a logo.

This feature is currently available on the following Stencil themes:

1. To access the checkout Theme Editor go to Advanced Settings › Checkout.

2. Click on the Customize Checkout button under the Style heading.

Style Option

Alternatively, you can access this part of the Theme Editor by going to Storefront Design › My Themes and clicking the customize button.

3. Click on the Optimized Checkout tab to access the section to customize the colors and logo that appear on checkout.

If you have uploaded a store logo, it will auto-populate in the Checkout tab, or you can upload a Checkout version.

See Cornerstone Theme Manual for more details on Checkout in the Theme Editor.

For advanced customization, you can make updates through the Stencil CLI. See our developer documentation for more information.

 

Using a legacy Blueprint Theme? To customize Optimized checkout, you have to edit the optimized-checkout-webdav.css file and re-upload it via WebDAV.

Multi-Language and Multi-Currency

Optimized One-Page Checkout will display the checkout with the currency the shopper chose on the storefront to keep the experience consistent.

If the store uses multiple languages, the experience can now extend to the checkout. To learn more on how to achieve this see our Developer Documentation for detailed instructions.

Free Shipping Banners

If you have set up a discount to "spend $X to get free shipping," a banner notification can be placed in checkout to notify shoppers how much more they need to spend to qualify for free shipping. See Creating Cart-Level Discounts for details on how to customize the location and messages of the free shipping banner. 

Was this article helpful?