Guide
How do I add Vagaro booking to my Squarespace site?
Salons, spas and solo providers who book through Vagaro and have a Squarespace site4 min readSeptember 2026
The short answer
Make a booking widget in Vagaro under Settings, then Booking Widget, and choose its type. The Link type gives you an address for any Squarespace button, which works on every plan. The In Website and Popup types give you HTML code for a Squarespace Code block, and Squarespace lists JavaScript and iframes in code blocks from its Core plan up. Vagaro's code is static, so add it again whenever you change the widget.
1. Make the widget in Vagaro
These steps are from Vagaro’s help center, which I read in September 2026. Vagaro says you can create a widget on the web, a tablet or Pay Desk.
- Go to Settings, then Booking Widget.
- Leave it set to your whole business, or pick one service provider from the employee list if the widget is for booking with them.
- Choose the tabs customers will see. If you include Services or Classes, you can choose specific ones, and the rest won’t show.
- Choose which tab opens first.
- If you want, add a Redirect After Booking address, which is the page customers see after they buy. Vagaro suggests a thank-you page.
- Pick a button color.
- Choose the Widget Type:
- In Website embeds the widget in your page.
- Link makes a link, which Vagaro suggests for social media and email.
- Popup or New Tab makes a button for your website that opens the widget in a popup or a new tab.
- Select Save, then Copy Code or Copy Link.
Two things from that article matter later. Vagaro says the code or link is static, so it won’t change when you change the widget’s settings. Each Save creates a new widget, and you have to add the new code to your site. It also recommends not editing the code it gives you.
2a. The Link type, on a Squarespace button
This works on every Squarespace plan, because it’s a link and not custom code. The steps are from Squarespace’s help center for version 7.1.
A button on a page. Edit the page, hover over the section and click Add block, then Button. Click the pencil icon on the block. Type the button’s words in the Text field, then attach a link and paste your Vagaro link under URL.
A button in the header. Open the Pages panel, click Edit, hover over the header and click Edit site header. Click Add elements and switch the Button toggle on. Click the new button, then Edit design, and set its text and link under Content.
A link in the menu. In the Pages panel, click the + icon, then Link. Give it a title like “Book” and paste the Vagaro link. There’s a toggle for opening it in a new tab.
2b. The code types, in a Code block
- Edit the page.
- Hover over the section and click Add block, then Code.
- Click the pencil icon on the block.
- Make sure HTML is selected in the Type menu, and paste Vagaro’s code into the text field.
Check your plan first. Squarespace says code blocks take plain HTML on all
plans, and that JavaScript or iframes in a code block need Core, Plus, Advanced
or one of its older Business and Commerce plans. I haven’t seen Vagaro’s code
from inside an account, so look at yours. If it contains <script or
<iframe, you need one of those plans.
Check it logged out. Squarespace says code sometimes won’t appear while you’re logged in, even when visitors can see it, and offers Preview in Safe Mode for that. I’d also open the page in a private window on a phone and on a computer after you publish.
If the embed is unreliable
In the comments under Vagaro’s article, several Squarespace users describe an embedded widget that showed up some of the time, or showed only its Book Now button. Those comments are four and five years old, so yours may be fine. Test it anyway.
If it misbehaves, there isn’t an obvious place to take it. Squarespace’s help center says custom code is outside its support, and suggests asking the service the code came from. Vagaro’s article says to check your website provider’s documentation. The Link type on a button doesn’t depend on either.
A widget for each service page
Because every Save makes a new widget, you can make one for each job:
- One limited to a single service, for the Book button on that service’s page.
- One for a single service provider, for a page about that stylist.
- One for the whole business, for the header.
Keep a note of which widget is where. If you change one in Vagaro, the code or link on your site has to be replaced.
Booking from Google is separate
Vagaro has its own setup for a Book Online button on Google, and it asks you to leave the booking links in your Google Business Profile blank. That’s covered in adding a Book Online button to your Google Business Profile.
The Vagaro guide covers what Vagaro’s own pages can do on Google, and Squarespace for salons and estheticians covers the Squarespace side.
I build on Squarespace. If you’d rather have the site built with booking wired in, that’s The Full Bloom, $1,000, once. The audit on the home page is free and doesn’t ask for your email.
The questions this usually leads to
Same rule as above: short answers, no hedging. If yours isn't here, just ask.
Does Vagaro integrate with Squarespace?
Vagaro's booking widget is either HTML code or a link, so it goes on a Squarespace site through a Code block or a button. Vagaro's help article doesn't name Squarespace. For embedding questions it says to check your website provider's documentation.
Do I need a paid Squarespace plan for the Vagaro widget?
Not for a button. A link on a button works on every Squarespace plan. For the code types, Squarespace says code blocks take plain HTML on all plans, and JavaScript or iframes from the Core plan up. Look at the code Vagaro gives you. If it contains a script or iframe tag, you need Core or higher.
Why isn't my Vagaro widget showing on Squarespace?
Squarespace says code sometimes doesn't appear while you're logged in, even when visitors can see it, and offers Preview in Safe Mode for that. Check your plan allows JavaScript in code blocks. And if you changed the widget in Vagaro, add the new code, because Vagaro says the old code doesn't update. If it still isn't dependable, use the Link type on a button.
Can I make a Vagaro booking button for one service or one stylist?
Yes. When you create the widget, Vagaro lets you pick one service provider from the employee list, and lets you choose specific services and classes to include. Every time you save, Vagaro creates a new widget, so you can make as many as you need.
Beep me
Tell me about your studio and what you're trying to fix. I read every message myself and usually reply within a day.




































