How to take manual payments, bank transfers and cash-on-delivery with Squarespace

Third Party Payment Method using Squarespace Commerce

Some customers don't want to pay for their orders using a credit card. Common types of manual payments include cash on delivery (COD), money orders, bank transfers (including ACH) and, in Canada, email money transfers. These customers can still place their orders online if you add a manual payment method. The same is true of businesses selling high value goods, who would prefer not to pay around 3% in payment fees.

If you already have a Squarespace website and you haven’t built and extensive online store yet, there is a solution. Get a low-cost subscription to Shopify and add it to your Squarespace website for around $9 USD per month.

If you can’t believe it’s that simple, try it out for free by clicking this link to start a free trial of Shopify and follow the steps that we describe below. If you would prefer an expert 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.

Shopify payment support

In addition to manual payment methods, Shopify supports many different payment providers in different countries and their fees are often lower than Squarespace’s partners. For example, in the UK and US Shopify payments take a lower percentage than Stripe. I’ve written another article that describes how to use the same Shopify account to accept Afterpay, iDEAL, Klarna or Zip Pay on your Squarespace website.

Add Shopify to Squarespace

With just a few simple steps, you can start selling through Shopify. 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 manual payment methods and take control of sales tax.

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 a manual payment methods, 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 Manual payment methods and choose Bank Deposit, Cash on Delivery (COD) or ‘Create custom payment method’ if you would like to create your own option, for example, ‘Pay In Store’.

Klarna Login

If you selected a custom method, choose a name for the Custom payment method name such as ‘Pay In Store’ or ‘Pay by Bank Transfer’.

In the Additional details box, type some helpful information to tell customers why they would choose this this option. For example, ‘Choose this option if you will be making an electronic payment to us from your bank account.’

In the Payment instructions box, type the instructions that the customer should follow after they have placed their order. These instructions should explain how to make their payment. For example, ‘Please make your payment to Bank Account 30-98-98 99887766 within the next 24 hours. Your order will not be processed until your payment has been made.’

Click Activate to save the changes and create the new manual method of payment.

You are now ready to accept orders with manual payment requests.

When someone reaches the checkout they’ll see the following

Manual payment option (Bank Transfer) in the checkout

Manual payment option (Bank Transfer) in the checkout

When you add additional payment providers (such as Shopify payments, Stripe or PayPal) these will also appear in the checkout as options.

I hope this has given you an introduction to taking manual 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 Shopify into your Squarespace website.