How to use Square as your payment processor in Squarespace 7.1


Heads up: affiliate link alert!
If you purchase any thing through the affiliate links below, I will earn a little dinero at no extra cost to you.


How to use Square as your payment processor in Squarespace 7.1

Many business owners have become true fans of Square payment processing and their innovative and streamlined approach to payment processing.

When we owned our first restaurant, implementing Square and their mobile card reader into our business made an enormous difference in the customer experience, speed of the payment transaction, and where it really counts--their very reasonable transaction fees and quick payouts. 

I know we’ve all had the experience of having an exceptional meal and great service to have it all but ruined because the server failed to bring back your change/credit card and receipt in an even remotely timely fashion. 

Tip to servers: Don’t blow it on the last, simple interaction with your guest--it could very well be the difference between getting an amazing 30-40% tip versus a measly 15%. 

It seems as though the checkout experience can lead to a similar regrettable encounter at the end of an otherwise great user experience on an e-commerce store. Unfortunately, since Square purchased Weebly another Website building platform, the workaround to use Square on your Squarespace store has vanished. 

Understandably, I suppose, but my most recent client has a small-scale boutique to-order cakery and truly hoped to keep things streamlined and actually get paid in a timely fashion. Her previous site was created with Wix and she had multiple issues with payments failing to process at all. 

Payment Processing Options

There are several options we found to solve her payment processing woes:

Option 1 | Link to Square Store

Create your website on Squarespace and have your “store”, or in her case, “cakes” navigation link directly to her store page on Square.

This is a simple no-hassle solution, but your Square store has limited design features so will not appear as on-brand as you may desire. 

Option 2 | Link to Square Store through Styled Page

Similar to Option 1 but with the additional step of adding your items or services into your “store” page--which is not a store page but just a regular page, styled to look like a store.

Any images or descriptions would then link directly to the Square store page where the transactions would take place.

Option 3 | Embed Ecwid Store in Squarespace

Embed an Ecwid store with Square payment processing into your Squarespace website.

Wow! That is a bit of a mouthful and may seem intimidating but in reality, our test store took about two hours to figure out all the necessary steps and my client’s 10 item store took less than 1 hour to build and integrate. 

Ecwid E-Commerce

So what is Ecwid anyway? Ecwid is an e-commerce platform known for its focus on small business solutions. In fact, their base level store of up to 10 products is free. Forever.

Ecwid is perfect for a small business that sells a limited number of products or for new entrepreneurs just getting started. Of course, the additional plans are tiered to grow with and match up to your business growth. 

After you sign up for the right plan for your business, during the store setup process, you simply select Square as your payment processor out of their numerous options. 

After building out your store to your liking, you’ll grab a couple of codes and head over to Squarespace to inject them into your—“Store”—page and footer, and voila you have an awesome store on your stylish Squarespace website with the best, in my opinion, payment processor Square!

Let’s break this down step-by-step for you:

HOW TO EMBED EQWID IN SQUARESPACE

Step 1 | Create A Square Account

Create a Square Account by clicking here then click “get started” and put in all your important details. Or simply login to your existing account here.

Step 2 | Create An Ecwid Account

Create an Ecwid Account by clicking here. Then follow the 4 step process to set up your account. Information you’ll need includes business name, business or a ship from address. 

Step 3 | Add Your Products

Add your products. This step took just over 5 minutes to complete if you have all your photos and descriptions ready to go. Go to: catalog > products you can add new products or use their option to import products. I simply copied and pasted the cake name and description, and then uploaded 1 to 10 photos for each product. 

Next, I added the price and adjusted for taxes, go to: settings > taxes > manage tax rates. Finally, you can go through all the design settings. Here you can choose the image size and aspect ratios, product card layout, and store layout to name a few. 

And just like that--your all done. One thing I discovered, on the free plan you do not have the ability to discount prices. This option is only available on a paid plan. 

Step 4 | Place Ecwid Code In Squarespace Code Block

Embed your Ecwid Store into your Squarespace Website. Now that you have your store all set up, you’re going to grab two different code snippets to drop into Squarespace. The first one, the Ecwid integration code, you’ll place into a new </> Code block on your “store” page. 

Find the code in Ecwid by going to: wedbsite > other platforms and site builders > pick platform > squarespace > copy code to clipboard. Now head over to your Squarespace site and edit your “store” page. Add a blank section and insert a </> Code block and paste in the Ecwid code snippet.  

Tip: make sure you have the section color styled as you desire prior to dropping in the code block! Don’t panic...you won’t see anything yet...your only halfway there! Make sure you save your work!

For even more detailed instructions or if you want to embed code for only a category or individual product click here.

Step 5 | Place Ecwid Script Code In Squarespace Footer

Grab the Ecwid script code next, which you should find just below the integration code. Copy that. Head back to Squarespace but navigate to Home > Settings > Advanced > Code Injection. Paste the script code into the footer section. Click Save. Presto! You should now see your embedded store. You’re almost done!

Step 6 | Test

Perform a test sale. The only way to know for sure if everything is set up correctly is to test it. Go through the process yourself of navigating your store, adding something to your cart, and completing the checkout process. 

Tip: If you have any trouble with the payment processing double-check in your Square account > apps to ensure Ecwid is enabled. 

Well there you have it—one great solution to use Square payment processing in your Squarespace website by integrating a comprehensive E-commerce Ecwid store.

Do you have any other integration solutions you’d love to share--leave a quick note in the comments!



Building a new website?
5 things to do before you start

Need help getting organized and inspired to build a new website?

This quick guide will get you started!


Know someone who could benefit from this article? Please share it with them:

Hej! Thanks for stopping in! Sisu Site Shop is an online business strategy + custom brand and web design studio. We sell Squarespace 7.1 templates, offer VIP Days for brand + web design + Dubsado setups for small businesses including Artists, Educators, and Hospitality Professionals. We serve clients worldwide from our current home base in Montana. We help you start, organize, and modernize your business, brand, and website so that you can sell, serve, and stand out online. If you have a project in mind we’d love to learn more about it!

When you’re ready here are three ways we can help you:

  1. Template Shop & Semi-Custom Website Design: Our custom Squarespace 7.1 templates provide a professionally designed foundation for you to build upon and customize! You can even upgrade to a semi-custom service and we’ll customize the template with your brand and photos.

  2. Online Business VIP Day: Our Online Business Intensive can help you create a strategy, build a simple website, or knock out admin to-dos!

  3. Custom Brand Identity, Website, & Automation Design: Truly elevate your online presence & processes
    for Squarespace 7.1 & Dubsado. We will partner with you to craft a brand & website you can’t wait to share!

We also have many tips and resources about strategy, design, and starting an online business. If we were chatting face to face, we’d offer you some tea and invite you to hang out for a while. Please consider this invitation to explore our site and learn more about our journey with the same intention!

When you’re ready to start your journey, build your business, and find your freedom, fill out our application to get started!


Color Palette ~
Early Spring Collection

Need inspiration for your new brand or website?

I hope these color palettes inspire you in your work and in your anticipation of spring and new beginnings.

Sign up to get the Guide!


Related Posts…

You’ll Also Love…

Brenda Thorpe

I’m Brenda Thorpe, the creator behind SisuSiteShop. We love all things design. We love the clean lines and ample white space of a minimal esthetic. We also love simple hand-drawn illustrations and vintage yet classy design elements. We are here to help you level up your website & online presence.

https://www.sisusiteshop.com/
Previous
Previous

1st year in business? My top 3 must use free tools

Next
Next

Building a website? 5 things to do before you start