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? Here’s my DIY guide to show you the basics but if you’d like someone to take care of this for you, 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.

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.

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 products don’t already exist on Squarespace, you could use Enhanced instead to add the product’s image, description and Add to Cart button.

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 some of our secret sauce* we can make this appear 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. If you need some help, you can book our Squarespace Expert 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

  • 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