How to add Afterpay, iDEAL, Klarna or Zip Pay to Squarespace in minutes

Third Party Payment Method using Squarespace Commerce

Built a Squarespace website and realised you can’t take payments using a popular payment method? You’re not alone. We’re asked about this regularly and here’s what we tell potential clients. Use the best of Shopify with Squarespace for around $9 USD more per month. Can’t believe it’s that simple? It’s completely free to try this out on your Squarespace website so what have you got to lose? Click this link to start a free trial of Shopify and follow the steps below.

If you prefer someone to take care of this professionally, please get in touch. As a Squarespace expert and a Shopify Partner, I can take care of whatever you need.

What payment methods does Shopify support?

Shopify supports different payment providers in different countries. For example, in the UK they include iDEAL via Mollie and Pay Later with Klarna. In Belgium they support Bancontact, iDEAL, PUT IT ON LAY-BUY and QuickPay and in Australia they support Afterpay, Laybuy and Zip (Pay) amongst many others.

As of June 2019, Shopify Payments is available in the Netherlands, including iDEAL as a payment method for Dutch shoppers. For Danish shoppers, Shopify Payments now supports Visa Dankort’s debit payments, and you can sell in either Danish Krone or Euros.

Add Shopify to Squarespace

With just a few simple steps, you can start selling right away. Create an account in Shopify, add your product, generate your Buy Button code, and copy and paste it onto a page of your Squarespace website. Your visitors can add multiple items to their shopping cart and enjoy secure checkout, or they can come back later to complete their purchase. You’ll be able to accept additional payment methods and take control of sales tax. All this for around $9 USD per month! Yes, really.

The Basics

1. Click this link to start a free trial of Shopify. When you click the free trial button, you’ll see the form below, asking you for some basic information - your email address, a new password and a name for your store. The name of the store will be used in all the order-related emails so you’ll want it to match your current Squarespace site.

How to start your free trial

How to start your free trial

2. Navigate to the Products section or follow the prompts to add your first product.

add-shopify-product.png

3. Just like in Squarespace, you’ll be prompted for a product title, description, image and price. Add the required information and click the Save button in the top-right of the window. Congratulations, you’ve now added your first product to Shopify!

Shopify navigation

4. In the Shopify navigation, look for the SALES CHANNELS section (at the bottom). You should only see one channel called Online Store. Click the plus (+) button to see a list of additional Sales Channels.

Shopify Sales Channels

5. Click the plus (+) button beside Buy Button.

Shopify Buy Button added

6. After a few seconds, Buy Button will be added to the SALES CHANNELS section and a button will appear entitled Create Buy Button.

Select Product

7. Click Create Buy Button. A window will appear prompting you to select one of your products.

8. Select the product you added (by clicking the radio button on the left) and then click Select product. A window will appear with many options (see below).

shopify-create-button-options.png

9. In the Template options, choose Button. This will allow us to add a button to a product that already exists on our Squarespace website. If you expect purchasers to want to buy more than one, you can go into the Button style and text options and choose Show quantity field.

Note that if your products don’t already exist on Squarespace, you could use the Enhanced template (instead of the Button template) to add images of the product, the description as well as the Add to Cart button. However, this isn’t the way I’ve described it in this article. If you do want to use the enhanced option, I suggest you follow this guide as it is, and then try the enhanced option later when you are familiar with the steps. To use the enhanced option you’ll want to skip steps 17 & 18 and add a new blank page instead of editing a product. You can then add the code to a Code Block on that new blank page and insert the generated code into it. Anyway, back to the steps..

10. From the Action on click dropdown, select Adds product to cart.

11. Click Generate code (in the top-right corner).

Generated code

12. The generated code will appear. Copy the code to the clipboard by clicking the button.

13. Logon to your Squarespace website and view the same product on your Products Page.

The Add to Cart button settings in Site Styles

14. Open Site Styles (on the Design menu).

15. Click the Add to Cart button to show the styles for the button.

16. Uncheck Show Button to hide the button.

17. Save the settings and then close the Site Styles panel.

18. Edit the Product.

19. Click Additional Info.

20. Add a Code Block.

Adding a Code Block to Additional Information

21. Remove the sample code from the Code Block and paste the Shopify code into it.

22. Click Apply and then Save the changes.

Relocated Shopify Button

23. You’ll now see the Shopify Buy Button below the product image and description. With our optional plugin you can make the button appear wherever you want, for example, just below the product title (as shown in the image above).

Shopify cart on Squarespace website

Shopify cart on Squarespace website

24. Click the Buy Button and the product will be added to the Shopify cart, bypassing the limited Squarespace cart. From here, customers can proceed directly to the Shopify checkout where they can pay with whatever payment method(s) you have installed in Shopify.

Payment Provider Settings in Shopify

Adding Payment Providers

To add payment methods to Shopify, click the Settings icon (in the bottom left corner) then click on the Payment providers link.

Klarna Pay Later Option in Shopify

Scroll down to Alternative payments and select the payment provider you want to use, for example Klarna.

Klarna Login

You’ll be asked to enter your login details for the payment provider you have selected. If you don’t have an account yet, click the sign up link.

I hope this has given you an introduction to taking other payment methods on your Squarespace website. This guide gives you an introduction to using Shopify, but it doesn’t explain how to set up all aspects of payments, tax or shipping. Shopify have some excellent guides to help you do this yourself, but if you need some help, you can book me (a Shopify Partner) to help you integrate any of the following payment methods with Squarespace by using Shopify or Sendowl.

  • 2Checkout

  • Adyen

  • Affirm

  • Afterpay

  • Alipay Global

  • Asiabill

  • Authorize.net

  • Bambora

  • Bancontact via Mollie

  • BitPay

  • Cartão de Crédito e Boleto via EBANX

  • Cartão de Crédito em até 12x via EBANX

  • Chase Paymentech (Orbital)

  • Checkout.com

  • Coinbase Commerce

  • ComproPago - Efectivo(Oxxo, 7Eleven,..), SPEI, Criptomonedas

  • Credit Card Payments Powered by PayTabs

  • CyberSource

  • Dankort Visa Debit

  • Divido

  • EBANX Payments in Latin America

  • Elavon Converge

  • ePay / Payment Solutions

  • eWAY Rapid 3.1

  • First Data Payeezy

  • G2A Pay

  • GoCoin

  • HiTRUST

  • IATS Payments

  • iDEAL via Mollie

  • Ignite Payments

  • Kash Direct Debit

  • Klarna

  • KNPay

  • Laybuy

  • Mercado Pago

  • Mondido Payments

  • Moneris

  • MultiSafepay

  • MyFatoorah

  • Ogone DirectLink

  • PagBrasil

  • PagSeguro

  • PayBright

  • PayDollar

  • PayFort

  • Payment Express PxPay

  • PaymentExpress

  • PAYMILL

  • PayPal Express Checkout

  • PayPal Payflow Pro

  • Paysafe

  • Paystation

  • PayU Latam

  • Pin Payments

  • PinwheelPay

  • POLi Internet Banking

  • Psigate

  • PUT IT ON LAY-BUY

  • QuickPay

  • Realex Payments (Offsite)

  • Sage Payment Solutions

  • SecurePay (Australia)

  • Sezzle

  • Shopify Payments

  • Skrill

  • SOFORT Banking (DIRECTebanking)

  • Stripe

  • Tap

  • Vantiv Integrated Payments

  • WorldPay (Direct)

  • WorldPay (Offsite)

  • Zip