Customising Shopify Checkout
Shopify is a great platform for e-commerce retailers of all sizes, who want reliable, high-converting stores that is simple to use. Shopify checkout has always delivered a good to reasonable experience for customers, but in terms of customisation it has been a relatively limited for brands. Shopify have always locked the checkout with limited scope for customization and only partial customization available for Shopify Plus sites which we have always seen as a massive oversight.
Previous Customising of the Shopify Checkout
For smaller merchants, Shopify checkout is prepared for speed and conversion right from the start with easy-to-use built-in features. This includes simple steps, local payment methods, having the option to have express checkout and light branding options. As merchants grow however, they may want more unique and advanced customisations and the ability to split test experiences in checkout.
In the beginning, Shopify Plus brands could make some limited customizations for Shopify checkout by working with a Shopify Plus Developer and requesting access to the checkout.liquid theme file to edit the code directly. This not only costs time and money but Checkout.liquid did not provide direct APIs for changes to Shopify Checkout. This often resulted in poor performance and the need for a developer to frequently (usually once per year) upgrade customized checkouts when it comes to accessing new features without breaking these customisations. There are also huge limitations on what can be done. e.g. the main need was always the ability to create a single page checkout or at least to split test that but that was never possible within the scope of Shopify’s checkout. Shopify kinda didn’t also give any data on why that specific checkout they created was best and since we know from testing in other contexts that a single page checkout performs better we found that frustrating. Especially when contracted to work on CRO for Shopify Plus stores.
Now, the Shopify platform has worked to provide a faster, upgraded safe way for brands to customise checkout….without the ability to create a single page checkout unless you’re using Shopify Payments. Here we feel Shopify have once again missed the needs of merchants and prioritized short term profitability (they make money from Shopify payments) over enterprise merchant requests which we believe is a false economy in the long term. Give people what they ask for or someone else will.
The New Way with Checkout Extensibility
Shopify has changed the way to customise checkout making it possible to add app blocks in the checkout, as well as opening up more opportunities for developers to build custom solutions for merchants. But again, none of this addresses the main need to create single page checkout experiences and split test the most important parts of your conversion process.
Instead of editing code like before, Shopify has now introduced apps and branding tools. Checkout.liquid is being depreciated.
Checkout Extensibility now makes it simple for Shopify Plus brands to customise checkouts – code-free. It is app-based, easy to upgrade and integrate with Shop Pay. It also provides flexibility on building the exact experiences brands want by developing custom apps using a collection of components. For Shopify developers this gives us some scope for what we need but tbh not what merchants really ask for. To us it seems like Shopify are trying to monetize the checkout instead of giving people what they need.
How it works:
For the first time, Shopify is unlocking the ability for developers to deploy checkout customizations through a custom app or public app on the Shopify App Store.
The checkout UI extensions enable additions to Shopify checkout such as custom content, fields, product offers, loyalty programs and more. The extensions appear in guest checkout and Shop Pay too, which creates a consistent brand experience for buyers wherever they choose to check out. Checkout UI also automatically adapts to the various checkout flows. So we see benefits here – although these things could mostly be done before and deployed very quickly with some custom code.
Another feature of Shopify Extensibility is Functions for managing Shopify server-side business logic for customising discounts on orders, products or shipping. Although how this is better than the scripts app remains to be seen. You can also build dedicated apps for Shopify checkout.
To bring it all together, the new checkout extensibility can bring some advanced customisations to those who don’t want to work with Shopify developers. Brands can tailor their checkout to match their website by changing the colours, fonts, adding favicon and customising the corner radius on any button or adding components like upsells without using a Shopify developer. But that shouldn’t be interpreted as giving you more control – indeed it could be less depending on your needs. At Liquify we would like to see a completely open checkout which gives us the power to really test what our brands & merchants need.
We remain critical. A fully open checkout flow this is not & there is much to be desired for enterprise clients here. If anyone at Shopify is reading this the clear requirement has always, always been for a single page checkout experience and the ability to split test. We don’t have that basic requirement here with extensibility. We have the ability to use single page checkout with Shopify payments only and to potentially bloat most important pages with apps (which traditionally on Shopify is the way things are done). We welcome speed improvements as checkout pages can be slow.
Is Checkout Extensibility the way forward?
Checkout extensibility will need to replace checkout.liquid ultimately. Checkout extensibility is potentially a faster checkout experience but this will depend on the apps deployed – usually apps = poor pagespeed so we will see what the net effect is. Built using the latest platform technology, the UI components and APIs run in a sandboxed environment which provides brands extra security, unlike the previous way of customising a Shopify checkout which is potentially less secure (although the worst that could happen is some customer data leakage and not payment data).
At present Checkout Extensibility is available for in-checkout pages which include the information, shipping and payment pages of checkout. As a creative and safe way of customising Shopify checkout, the previous checkout.liquid is deprecated and will no longer work for in-checkout pages after August 13th 2024.
All Shopify Plus brands that use checkout.liquid will need to upgrade to Checkout Extensibility after this date. And we are currently actively planning new checkout flows for our Shopify pLus customers.
Want to know more? Or need help updating your checkout to checkout extensibility?
Want to know more or want to start customising? Get in touch with our friendly team who can help develop and scale your Shopify Plus store. Our Shopify Plus developers are some of the best in class and our premium full service retainers covering all services are a great fit for those looking to scale on Shopify Plus.
FAQs About Shopify Checkout Extensibility
What is Shopify Checkout Extensibility?
Shopify Checkout Extensibility gives brands control over the customisation of their eCommerce checkout experience with a range of new apps and branding tools.
Just some of the ways Shopify Checkout Extensibility can be used:
Customise UI and content: create bespoke functionality that merchants can install at specific points in the checkout flow.
Alter the appearance of Shopify Checkout: using the new Checkout Branding API, checkout can look consistent with the rest of the store by adding the brand logo, fonts and colours. Although you will need the help of an experienced Shopify Plus development agency to do this.
Customise backend discounts: currently in developer preview, merchants will have the flexibility to extend backend discounting logic for orders, products or shipping. This can help with tiered discount options for example.
Post-purchase page options: add new content to a post-purchase page using post-purchase extensions. This can be used to show customers product offers, or ask for additional information after checkout, but before order confirmation.
Buying behaviour tracking: add a tracking pixel to collect behavioural data on buyers. The Web Pixel API can help provide measurements and optimisation of marketing campaigns for conversion performance. It can also provide event lists that merchants can subscribe to.
Is Shopify Checkout Extensibility better than the previous Shopify Checkout?
The old Shopify Checkout experience is still great for speed and performance, however, it does not allow for easy custom options with apps. We fail to see the benefits of checkout extensibility but hope it is just phase 1 of a bunch of updates that bring more control to the checkout flow.
Rather than modifying the checkout code directly like before which results in time and money, Shopify say Checkout Extensibility makes it easier for in-house teams or developers to customise more, without the complex work. But when you use it you’ll find that to add advanced branding you’ll need a Shopify Plus Expert. We are cautiously split testing with the Shopify checkout extensibility functionality and aren’t being sold on the benefits of it yet.
Who can use Shopify Checkout Extensibility?
Shopify Checkout Extensibility is currently only available to Shopify Plus accounts.