Upgrading to Checkout Extensibility

With checkout.liquid, you could customize the look and feel of your checkout by adjusting branding settings in the Theme Editor, or by adding custom CSS/styles to your checkout.liquid theme file. With Checkout Extensibility, you can use the checkout editor and/or the Branding API.

• If your customization changes the colors, fonts, and general styling of your checkout, the checkout editor will be able to accommodate most of your needs. The checkout editor has two main sections, including the branding section and customizations section. In the branding section, you can customize the appearance of your checkout, including colors, fonts, and logos.
• If you need finer control over checkout branding, the checkoutBrandingUpsert mutation can be used by a developer using the branding API.

With checkout.liquid, you could add or remove UI and content from your checkout by adding JavaScript code to your checkout.liquid file. With Checkout Extensibility, these customizations are deployed via apps. You can either install an app from the Shopify App Store or develop a custom app. These apps are then configured in the checkout editor.

Currently, Checkout Extensibility supports the following use cases:

Custom banners, trust badges, or warnings

• Recommended apps:
  • Checkout Blocks
  • Checkout Plus
• Custom app development tutorials:
  • Custom banners
  • Custom fields

Product offers

• Recommended apps:
  • Rebuy Personalization Engine
  • One Click Upsell
  • Aftersell Post Purchase Upsell
  • UpsellPlus Checkout Upsells
• Custom app development tutorials:
  • Pre-purchase offers
  • Post-purchase offers

Loyalty programs

• Recommended apps:
  • Smile: Loyalty and Rewards
  • Loyalty, rewards and referrals
  • Yotpo: Loyalty & Rewards

Third-party gift card systems

• Recommended apps:
  • Rise.AI: Gift Cards & Loyalty
  • Giftnote Digital Gift Messages

Order status page customizations

• Custom app development tutorials:
  • Order status page extensions

Don't see what you're looking for? Refer to the Checkout Extensibility roadmap for future use cases we'll support.

Previously, you could use Shopify Scripts to add custom logic to your checkout. However, Shopify Functions are the new way to replace key parts of Shopify's backend logic and will eventually replace Shopify Scripts. You can either install an app from the Shopify App Store or develop a custom app. These apps are then configured in the checkout editor.

Shopify Functions currently support the following use cases:

Discounts

• Recommended apps:
  • Discount Apps built on Shopify Functions
  • Discount Ninja
  • Discount Kit
  • ReConvert
  • Checkout Bear
• Custom app development tutorials:
  • Build a discounts experience

Payment customizations

• Recommended apps:
  • Payment Customizations powered by Functions
• Custom app development tutorials:
  • Build payment customizations

Delivery customizations

• Recommended apps:
  • Delivery Customizations powered by Functions
• Custom app development tutorials
  • Build delivery customizations:

Cart and checkout validations

• Custom app development tutorials:
  • Getting started with cart and checkout validations

Order routing location rules

• Custom app development tutorials:
  • Getting started with building location rules

Custom bundles

• Custom app development tutorials:
  • Add a custom bundle

Don't see what you're looking for? Refer to the Checkout Extensibility roadmap for future use cases we'll support.

Shopify Scripts are currently compatible with Checkout Extensibility, so you can upgrade to Checkout Extensibility without worrying about your Scripts to start.

With checkout.liquid, you could add tracking pixels to your checkout, either installed directly, or through a tag manager like Google Tag Manager, by adding code to your checkout.liquid theme file or Additional Scripts. With Checkout Extensibility, you can use the new pixel manager.

In the pixels manager, you can add pixels by installing an app from the Shopify App Store or add a custom pixel. It's important to look for a pixel app before adding a custom pixel to ensure you're getting the best, more secure integration experience possible.

Checkout Extensibility makes it easier for Shopify Plus merchants to customize their checkout in a way that’s app-based, upgrade-safe, higher-converting, and integrated with Shop Pay.

Shopify is investing in Checkout Extensibility as the sole way to customize Shopify Checkout moving forward, replacing the need for checkout.liquid. As a result, checkout.liquid has been deprecated and will no longer work for the Information, Shipping and Payment pages starting August 13, 2024.

Checkout.liquid, script tags and additional scripts for the Thank you and Order status pages are also deprecated. These will be turned off and no longer supported by August 28, 2025.

Any merchants that currently customize their checkout with checkout.liquid need to upgrade to Checkout Extensibility before the above dates.

You can learn more about Checkout Extensibility on the following channels:

Shopify help center:

• Customizing and editing your checkout
• Pixels and customer events

Shopify dev docs:

• Customizing Shopify checkout

Blog posts:

• 5 Ways to Customize Shopify Checkout
• Checkout Extensibility Opens New Ways to Customize Checkouts on Shopify
• 10 Ways to Customize Checkout with Checkout Extensibility
• Shopify Functions: The New Way to Extend and Customize Shopify

Shopify App Store:

• Create a custom checkout with apps collection
• Pixels app collection

Videos:

• Shopify Checkout with Checkout Extensibility
• How to add or modify custom pixels in your Shopify Store

You need to upgrade your Information, Shipping and Payment pages from checkout.liquid to Checkout Extensibility by August 13, 2024 and your Thank you and Order status pages by August 28, 2025. However, it can take anywhere from a few days to a few months to complete your upgrade, depending on the complexity of your customizations. For example, you may need to develop custom apps for some customizations, which takes more time.

We recommend planning for your upgrade sooner rather than later, so you can ensure you have enough time to complete your upgrade. Use the Checkout Extensibility upgrade kit as a guide to kickstart your planning process.

Yes, there is a roadmap for Checkout Extensibility posted on the Shopify dev docs.

With checkout.liquid, you needed to perform periodic upgrades in order to access new checkout features. The last upgrade for checkout.liquid took place in January 2020. Since then, we've shipped powerful features for Shopify Checkout, including:

• One-page checkout
• Tooltip for estimated tax
• Pre-orders
• Discount combinations
• Shop Pay Installments
• Shop Promise
• Estimated delivery dates
• Shipping discounts
• Shipping to pickup points (currently only available in France)
• Subscription shipping rate names
• SMS marketing opt-in
• Email marketing opt-in
• Flexible shipping addresses
• Customizable checkout experience

To access these features, you need to upgrade to Checkout Extensibility. You’ll also gain access to new features, like the one-page checkout, as soon as they’re available—no upgrades required.

No. The last upgrade for checkout.liquid took place in January 2020. In order to access new checkout features, you need to upgrade from checkout.liquid to Checkout Extensibility.

Yes! The Upgrading to Checkout Extensibility demo video provides a high-level overview of how to upgrade from checkout.liquid to Checkout Extensibility. There are also short demo videos for Checkout Extensibility and pixels:

• Shopify Checkout with Checkout Extensibility
• How to add or modify custom pixels in your Shopify Store

Shopify has also partnered with Coding with Jan to produce more detailed demo videos for checkout UI extensions, Shopify Functions, and upgrading to Checkout Extensibility:

• A Brand New Type Of Shopify Apps: Checkout Extensions
• Functions - a new way to customize Shopify

Checkout Extensibility is designed to optimize performance and make your checkout more secure by sandboxing customization code. We also vet public checkout apps for performance impact, so you can make customizations without sacrificing speed.

This is a huge improvement over making customizations in checkout.liquid, where you could inject arbitrary, unsandboxed code without direct APIs. This often resulted in sub-par buyer experiences and poor performance. Not to mention, Shopify was unable to monitor the performance of checkout.liquid customizations and make improvements. But with Checkout Extensibility, we can.

While it's possible that using many apps at the same time in checkout may result in a step back from peak performance, this was more true in checkout.liquid and Shopify is better equipped to optimize for this scenario with Checkout Extensibility.

Yes, Checkout Extensibility will work seamlessly between the one-page and three-page checkouts. Both checkouts have the same set of extension points and will be automatically mapped.

With Checkout Extensibility, customizations run in an app-scoped context. Unlike checkout.liquid, where customizations run on the parent element in the DOM, these apps run in a sandbox that cannot directly influence the parent DOM or other elements within the checkout process. This allows for more stable, performant, secure, and upgrade-safe customizations.

Customizations that require access to the parent DOM or other elements on the page, don't work with Checkout Extensibility. Examples of types of apps that are impacted by this change include:

• Heatmaps
• Visitor Recording
• A/B Testing which relies on manipulating the DOM directly
• Performance Monitoring

There are also a few eligibility requirements that must be met before upgrading to Checkout Extensibility. These are listed in the Shopify help center.