Introduction
Checkout integration
Integrating Cardigan with your Shopify checkout allows customers to redeem their gift cards during the purchase flow.
Cardigan supports both the legacy Shopify checkout (through checkout.liquid
customisation) and the new Shopify checkout (also known as "Checkout One"), which will be mandatory for all merchants by August 2024.
Shopify Plus only
Checkout integration is available only to Shopify Plus merchants.
For non-Plus merchants, an alternative flow allowing customers to redeem external gift cards from the Shopify theme cart page is available - contact us to learn more.
New checkout integration
Cardigan exposes gift card functionality in the new checkout via one of two checkout extensions. Both extensions provide an expandable form for a customer to enter their card number (and PIN if required) before attempting to apply it to their checkout.
You can learn more about checkout extensions and how to add them to your checkout from the Shopify documentation.
Inline checkout extension
The inline checkout extension can be placed in any section of any step of the checkout body.
Typically, it is placed above or below the payment methods section of the final payment step.
Summary checkout extension
The summary checkout extension renders in the sidebar of the checkout, underneath the standard Shopify discount code input.
Updating discount code input language
Unlike the legacy checkout integration, the new checkout integration doesn't allow for hooking Cardigan's functionality directly into the standard Shopify discount code / gift card input.
As a result, we recommend updating your Shopify theme's language content to remove any reference to "gift cards" in that input component to avoid confusing your customers about where they should apply their gift card.
Legacy checkout integration
For merchants with checkout.liquid
customisations enabled, Cardigan offers a simple snippet that can be included in your checkout layout template in two easy steps.
1. Add the Cardigan checkout snippet
Copy the latest version of the Cardigan checkout snippet from here into snippets/checkout-cardigan.liquid
in your Shopify theme.
2. Render the snippet from your checkout layout
Render the snippet in the <head>
of your checkout.liquid
file using {% render 'checkout-cardigan' %}
, something like this:
...
<title>{{ page_title }}</title>
{{ content_for_header }}
{{ checkout_stylesheets }}
{{ checkout_scripts }}
{% render 'checkout-cardigan' %}
</head>
...
Upgrading from legacy checkout to new checkout
Moving from checkout.liquid
to the new checkout is straightforward.
Simply follow Shopify's instructions for upgrading your checkout, then add one of the two available checkout extensions to your new customisable checkout as described above.