How to add a 3rd party payment gateway to your Squarespace site (2022 update)

Squarespace has undergone a few changes since we wrote this blog (namely the new fluid engine) but with regards to payment gateway’s, the only new option we’ve received is Square.

We still don’t have the option to natively connect any of the other gateways mentioned in this blog post.

PayPal and Stripe are two of the largest and most dependable payment providers for transactions on the web; However, PayPal and Stripe are not supported in every country.

Square is also making its Squarespace debut, but is only available in the US.

Squarespace facilitates three payment processors (PayPal, Stripe and now Square), but due to technical limitations, Squarespace cannot provide payment processors outside of what’s already integrated with the platform, meaning some people have to seek alternatives.

Squarespace facilitates three payment processors (PayPal, Stripe and now Square).

As we don’t have access to Squarespace’s backend code, we cannot integrate another payment processor with Squarespace' own eCommerce features; we have to integrate different eCommerce software.

PLEASE NOTE: Different eCommerce software isn’t a new payment provider, it’s a new Product Management System for which you will need to pay a subscription.

Popular choices that are easy to combine with Squarespace are Shopify and SendOwl; both of which allow you to embed ‘Buy Buttons’ into your Squarespace site, accepting transactions from the payment processor of your choice.

The “Lite” plan for Shopify, and the “Basic” plan for SendOwl are both $9 per month.

Whenever going through any payment gateway, it’s always advised to look for any hidden fees. Our recommendation is to look at two or three different options and then comparing them to make sure you have a solution that best suits your needs.

For example, Shopify will charge 2.2% + 20p per credit card transaction (outside of its own payment provider), whereas SendOwl doesn’t issue transaction fees.

How to guide:

The following illustrates how you can use Shopify to choose a payment gateway of your choice and then add it to your Squarespace site.

Please bear in mind that this guide requires you to have the “Business” hosting plan.

How to add your payment gateway to Shopify

1) Create a Shopify account and start a free trial by clicking here.

2) Click the “Settings” option in the lower left-hand corner, and then click the “Payments” option.

3) Scroll down to the “Supported payment methods” section and click on the “Add payment methods” button.

4) You can search for your preferred payment method either by payment method or by provider.

5) After you’ve found your preferred method, click on the “Activate” button.

6) As each payment method is different, there will be varying details you’ll need to provide based on your chosen payment method, but after you’ve provided the necessary details, click on the “Active” button at the bottom of the page.

How to add a Shopify “Buy” button to your Squarespace site:

Shopify Section

1) Create a Shopify account and start a free trial by clicking here.

2) Click on “Products” from the left-hand sidebar, and click “Create Product”.

3) Create a product that matches a product you already have in your Squarespace store.

4) After you’ve created your product, from the left-hand sidebar, click on “Sales channels” and when prompted type in and search for “Buy button”.

5) The Shopify App store will open in another tab; you should select the “Buy Button channel” app, then click “Add app”, scroll down to the bottom of the page and select the “Add sales channel” button.

6) Click the “Create a Buy Button” button, then select the “Product Buy Button” option and select the product you want to create the button for.

7) Switch the “Layout style” to “Basic” and ensure the “Action when people click” option is set to “Add product to cart”, then click “Next”. You can also change the appearance of the button under the “Button style” option and change the layout options (such as alignment, etc…) under the “Layout” options.

8) Copy the code and switch over to your Squarespace site (I’d leave the tab open so you can re-copy the code if need be).

Squarespace section

1) In your Squarespace admin site, navigate to your store page.

2) Find the product which matches the product you created in Shopify, click the 3 dots (settings) and click “Edit”.

3) Under the “Details” section and click on the “Additional Info” option.

4) Add a code block to the page and paste the code from Shopify.

5) Click the “Apply” button and then click the “Save” button.

Optional

You’ll notice that after you click “Save” your product will have 2 buy buttons. If you want to give your users the option to choose whether they pay via Squarespace and your new payment method then you can ignore this part.

However, if you only want to take payments through the new payment method, then copy and paste the code below into the CSS editor under the Design settings.

The code will remove the "Product Variants", "Quantity" and "Add to Cart" options from all products on your Squarespace store.

/*Removes Squarespace "Product Variants", "Quantity" and "Add to Cart" button*/
.product-variants,
.product-quantity-input,
.sqs-add-to-cart-button-wrapper{
  display:none !important;
}

Here is a list of the payment processors that are supported by Shopify and SendOwl (Updated 2019):

• 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

• 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

---