BigCommerce
Storefront
Cart and Checkout
Custom Checkouts

Checkout Customizability

BigCommerce provides significant levels of checkout customizability. If you just want to modify the theme by overriding the style of BigCommerce’s Optimized One-Page Checkout, please see Restyle Optimized One-Page Checkout. However, if you want to build a custom checkout, there are two paths that a developer can choose to use.

The first path is to render the checkout on the BigCommerce storefront. With the storefront suite of APIs and SDKs, BigCommerce as a platform maintains responsibility for managing shopper sessions using cookies and all our standard mechanisms.

The second path is to render the checkout experience outside of the BigCommerce storefront. The Management APIs are for consumption by other servers on the internet, which in turn are responsible for session management, whether that's a website running on a CMS or a native mobile app.

Once a developer has chosen a path, they can choose the options they want to use to build the custom checkout. The table below provides an overview of the different options available to help developers select the one that best suits their needs.

Checkout options

What is it?When should I use it?Where do I find it?
Open CheckoutOpen checkout is the open-source option of BigCommerce's Optimized One-Page Checkout.

A browser-based application that converts a cart to an order, allowing shoppers to complete checkout.

Our reference implementation of checkout built on top of the Checkout JS SDK.
This option allows developers to create a custom checkout from a fully functional foundation (as a starting point for their efforts or even contribute to it).

Add features or make moderate-sized changes to BigCommerce’s checkout (hosted on the BigCommerce storefront).
Open Checkout Quick Start
Checkout JS SDKA client-side vanilla JavaScript library that is a wrapper for the Storefront Checkout API.

The SDK handles all the API calls necessary to move shoppers through the checkout experience. From customer login, fetching shipping quotes, and payment methods through to paying an order.
This option allows developers to build a custom checkout from scratch by creating a presentation layer for checkout. Completely replacing the UI/UX without having to do the heavy lifting of dealing with Storefront API endpoints.

Significant front-end customizations and/or feature additions to checkout (hosted on the BigCommerce storefront).

Limitations:
  • SDK does not let you introduce new behavior. While you can filter based on shipping methods, you cannot create new shipping methods or payment methods.
  • Hosted forms do not work with Stencil localhost since forms are served over https and Stencil only supports http. Developers must test the order confirmation flow on Stencil using offline payment methods.
Checkout SDK
Storefront Checkout APIGraphQL and REST APIs create and update a checkout and convert it to an order.

This option allows developers to build a custom checkout experience (within the context of a BigCommerce storefront session) by accessing raw API request/response data.

These are the APIs you would typically access from your browser using JavaScript to retrieve checkout data not available through the SDK.
GraphQL Storefront API: Carts and Checkout

Storefront GraphQL API Reference

Storefront Checkout API

Storefront Cart and Checkout
Management Checkout APIREST APIs create and update a checkout and convert it to an order.This option allows developers to build a custom checkout (outside of a BigCommerce storefront session) and use the Payments API to pay for an order.

When used with the Management Cart API it allows you to make modifications similar to those performed using the control panel option Orders > Add. These modifications include the ability to create custom products, modify prices, add custom discounts, set custom prices for shipping, etc.

These are the APIs that will power your headless checkout solutions on channels such as:
  • Content management systems
  • Native mobile apps (non-web view)
  • Internet of Things (IoT) devices
  • Recurring order and/or subscription apps (e.g. OrderGroove)

Note: Currently, this API currently does not support using store credit or gift certificates as payment methods.
Management Checkout API

Resources

Related articles

Did you find what you were looking for?