You can embed a Square Appointments booking widget or button on your existing website, making it easy for your clients to find your availability and book an appointment.
We know the embed process can be confusing, so we put together a how-to guide for some common website builders - Squarespace, Wix, Weebly, and Wordpress. Keep in mind that our community admins and support team can’t help troubleshoot non-Square products, since we’re not the experts! If you’re having any trouble with your website management system, you’ll have to reach out to them directly, or ask fellow sellers here in the community.
Let’s get to it!
The first thing you’ll need is the code for your Square Appointments widget, available from the Square dashboard.
Read more about Using the Code Block on the Squarespace.
Read more about adding HTML code with Wix.
Note: embed code won’t take up the entire page as previewed. Consider resizing it accordingly after publishing and refreshing the page.
Read more about creating widgets and embedding code with Weebly.
Read more about HTML with Wordpress.
We hope this makes embedding your appointments widget a little easier. Feel free to comment here to let us know how it’s going!
Posted 04-07-2017
You can embed a Square Appointments booking widget or button on your existing website, making it easy for your clients to find your availability and book an appointment.
We know the embed process can be confusing, so we put together a how-to guide for some common website builders - Squarespace, Wix, Weebly, and Wordpress. Keep in mind that our community admins and support team can’t help troubleshoot non-Square products, since we’re not the experts! If you’re having any trouble with your website management system, you’ll have to reach out to them directly, or ask fellow sellers here in the community.
Let’s get to it!
The first thing you’ll need is the code for your Square Appointments widget, available from the Square dashboard.
Read more about Using the Code Block on the Squarespace.
Read more about adding HTML code with Wix.
Note: embed code won’t take up the entire page as previewed. Consider resizing it accordingly after publishing and refreshing the page.
Read more about creating widgets and embedding code with Weebly.
Read more about HTML with Wordpress.
We hope this makes embedding your appointments widget a little easier. Feel free to comment here to let us know how it’s going!
Hi @jackfrost, @bylaufi and @phyn!
Thanks for reaching out to the Community about this.
Following a recent discussion with another Seller here on the Community, I reached out to our Appointments team for further clarity. Unfortunately they did confirm that this is expected behaviour, and the related US Support Centre article has now been updated to reflect the most up to date information.
I've also requested that the support centre articles for the other countries we support be updated.
I have read through the comments below and most are quite old, it is now October of 2021.
The issue I am having is when I embed the code in Wordpress, the Square code results in taking over the editor. I know that Square has been aware of the issue for sometime now, and wondering if you have created a solution?
Dave in Toronto.
Welcome to the Seller Community, @DavidVanGo
Can you clarify what you mean by "taking over the editor"? Does embedding the Square Appointments code prevent you from editing your website?
This may be something that needs to be looked at by Wordpress, but any additional information you can provide would be helpful. Thanks! 😊
Yes, it prevents me from further editing. Apparently, this is a common issue as there are many discussions on it over the web. In essence, I need to remove the Square code, continue editing my site, then, when fully edited, place the Square code back in. Quite ineffective. Are you aware of this issue?
I embedded the widget that says it is inline but it redirects as soon as you click the "book now" button? Is there no way to keep it from redirecting and staying in the iFrame/embed?
Hi,
I’ve successfully embedded the Square Appointments widget on my local website. However, I’ve noticed that whenever a specific service is selected, it opens in a new tab rather than staying within the same page.
This behavior disrupts the user experience and detracts from the seamless integration I was aiming for.
Could you please advise on how to resolve this issue? I’d like the booking process to remain contained within the embedded widget on my website without triggering a new tab.
Thank you in advance for your assistance. I look forward to your guidance on this matter.
Best regards,
Hi @Kim17,
Apologies, this query seems to have slipped through the net!
When it comes to embedding code on a 3rd party website, we are limited in the support we can provide. However, if you let the Community know who your site is hosted with, you may find that another Seller can help guide you.
Failing that, we’d normally recommend that you reach out to your web host for advice on customising the navigation UX.
For now, I’ve gone ahead and merged your post to an existing thread where other Sellers and Community moderators have discussed the nuances of adding the Appointments booking widget to 3rd party sites.
having a problem with embedded widget staying on my site. I have my own site it is not wordpress or anything i host it on aws myself. the widget iframe works and shows everything just fine. the problem is when a user selects a service to book it instantly goes to squareups site instead of staying on my site and working there.
kind of making it embed pretty pointless.
Did you ever find a solution for this? Like you, I want to keep the person on my site rather than have it open in SquareUp.
nope. anything i try it still jumps from my site and opens a new windows to squares page that it appears i can not modify to make look like it isn't some scam.
Hi @jackfrost, @bylaufi and @phyn!
Thanks for reaching out to the Community about this.
Following a recent discussion with another Seller here on the Community, I reached out to our Appointments team for further clarity. Unfortunately they did confirm that this is expected behaviour, and the related US Support Centre article has now been updated to reflect the most up to date information.
I've also requested that the support centre articles for the other countries we support be updated.
This is ridiculous, the whole point of a "embed widget" is to keep the customer on your site...
Instead we are given what amounts to a bunch of links..
I have just signed up for Square appointments and bought a terminal... The fact I could keep a customer on my site via a widget was one of the main selling points that got me to sign up...
After spending the last couple of days setting everything up... the last step is embedding in my website... I now find this out...
Signing up to square seems to have been a major mistake.
Honestly, square appointments is basically a dead product. They haven't improved it in years, and it lacks many extremely useful features.
Square Community
Square Products