How to integrate Clearpay to Shopify
Clearpay is a service that allows shoppers to receive products immediately and pay in 4 instalments over a short period of time. The service is completely free for customers who pay on time – helping consumers spend money responsibly, without incurring interest, fees or revolving in extended debt.
Clearpay is part of the Afterpay group and is offered by over 43,200 of the world’s best retailers and has more than 7.3 million active customers globally. The service is currently available in the United Kingdom, Australia, New Zealand, the United States and Canada.
Please note that the Store Address must correspond to the Clearpay account region.
- Navigate to: Shopify Admin > Settings > General
- Under “Store address”, the “Country” must be: United Kingdom
Please note that the Store Currency must correspond to the Clearpay account region.
- Navigate to: Shopify Admin > Settings > General
- Under “Store currency”, the “Store currency” must be: British pound (GBP)
Completing the below steps will enable and display Clearpay as a Payment Method.
- Ensure you are logged in to the Shopify Admin as the Shopify Store Owner.
- Navigate to Settings > Payment Providers.
- Under the ‘Alternative payments’ section, click on the “Select additional payment method” dropdown.
- Select ‘Clearpay’ from the dropdown options.
- Enter the Merchant ID provided by Clearpay into the Merchant ID field.
The Merchant ID is a 9 digit number (please remove your email address if in this field). If you don’t have this please contact your Clearpay Delivery Manager - Enter the Secret Key provided by Clearpay into the Secret Key field.
The secret key is a long mixture of numbers and letters (please make sure there are no blank spaces copied as this will cause an error) - Be sure not to check the Enable test mode box, as pictured below. The integration will not work if this box is checked.
- Click the Activate Clearpay button.
Notes: The “Enable test mode” checkbox/function is only applicable for dedicated test websites. Advise your Clearpay Account Manager should test credentials be required.
Completing the below steps will position the Clearpay visual assets on the Product and Cart pages of your Shopify website.
- From your Shopify admin, go to Online Store > Themes.
- Find the theme you want to edit, and then click Actions > Edit code.
- Under the Layout folder, click on theme.liquid
- Scroll to the bottom of the theme.liquid file, and click to place the cursor at the end.
- Copy and paste the code below into the bottom of this file123456789101112131415161718192021222324252627<!-- Begin Shopify-Clearpay JavaScript Snippet (v1.0.10) -->{% if cart.currency.iso_code == shop.currency %}<script type="text/javascript">// Overrides:// var clearpay_min = 0.04; // As per your Clearpay contract.// var clearpay_max = 1000.00; // As per your Clearpay contract.// var clearpay_logo_theme = 'colour'; // Can be 'colour', 'black' or 'white'.// var clearpay_product_selector = '#product-price-selector';// var clearpay_cart_integration_enabled = true;// var clearpay_cart_static_selector = '#cart-subtotal-selector';// Non-editable fields:var clearpay_shop_currency = {{ shop.currency | json }};var clearpay_cart_currency = {{ cart.currency.iso_code | json }};var clearpay_shop_money_format = {{ shop.money_format | json }};var clearpay_shop_permanent_domain = {{ shop.permanent_domain | json }};var clearpay_theme_name = {{ theme.name | json }};var clearpay_product = {{ product | json }};var clearpay_current_variant = {{ product.selected_or_first_available_variant | json }};var clearpay_cart_total_price = {{ cart.total_price | json }};var clearpay_js_snippet_version = '1.0.10';</script><script type="text/javascript" src="https://static.afterpay.com/shopify-clearpay-javascript.js"></script>{% else %}<!-- Clearpay disabled: {{ cart.currency.iso_code }} != {{ shop.currency }} -->{% endif %}<!-- End Shopify-Clearpay JavaScript Snippet (v1.0.10) -->
- Click Save and you are done.
Go to the website and review the product page for Clearpay assets.