3 Ways to Easily Embed Calendly Into Your Squarespace Website
Potential clients and networking prospects appreciate the flexibility of being able to schedule an appointment with you at their convenience and without having a back-and-forth email conversation with you in order to get something in the books.
Many business owners have found Calendly to be one such option. While I’m not affiliated with Calendly, I have scheduled several networking calls with others using their Calendly scheduling links, so I know it is seamless from the client’s perspective.
I also know they have a free option, which is why I suggested it as an option to one of my clients for her Squarespace 7.1 website. You can view Calendly’s plans and pricing here.
Is It Hard to Add Calendly to Your Squarespace Website?
The short answer is, “No.”
But I will say, before making the video tutorial for this, I had never done it before and I didn’t find their instructions to be very intuitive, so the video tutorial is very “organic” to say the least!
That said, you may find it helpful for avoiding some possible pitfalls.
My step-by-step tutorials just below the video tutorial are short and sweet and you may find them preferable.
I’m a visual learner myself, so I always opt for the video tutorial.
1. Share the Entire Calendly Calendar to Your Site
This option embeds all of your Calendly calendar “events.” An event is essentially an appointment type.
If you want all your appointment types displayed on your website, then this is the option for you.
Login to your Calendly account
In the upper right select Account > Share your link
From the pop-up select “Add to your site.”
Select “Inline Embed”
Customize the colors to match your brand by changing the HEX codes
Select “Copy Code”
On your website, add a code block and position it roughly in the area where you want the calendar to appear
Highlight the dummy text in the code block and paste your code here
Select “Save” and “Exit”
You may have to play with the positioning until you get it just right
2. Share One Appointment Type to Your Website
It’s common to have several appointment types for your business, some of which you’d prefer to send as a private link to specific people rather than have them all displayed on your website.
For example, you may have a scheduling link for potential clients to schedule a Discovery Call and you may have another link that you send to people to set up a networking 1:1 call.
If you want to display a single “event,” or appointment type on your website, this is the option for you.
Login to your Calendly account
Select “Event Types” from the tab menu
Locate the Event Type (or appointment type) you want to share and select “share”
Select “Add to website”
Select “Inline Embed” and continue
Customize the colors to match your brand by changing the HEX codes
Select “Copy Code”
On your website, add a code block and position it roughly in the area where you want the calendar to appear
Highlight the dummy text in the code block and paste your code here
Select “Save” and “Exit”
You may have to play with the positioning until you get it just right
3. How to Embed the Calendly Widget Into Your Squarespace Website
This option generates a “widget,” or CTA button that will appear in the lower right corner of your website and will remain static so that it can be viewed and accessed from every page on your website, kind of like the Chatbox on my website! ↘
To add the Calendly widget to your website, first decide if you want your entire Calendly calendar to appear on your website as outlined in option #1 above, or if you just want a single event or appointment type as outlined in option #2.
Then follow the instructions above depending on your preference, but instead of selecting “Inline Embed,” you’ll select “Pop-up Widget” and “Continue.”
Then follow these instructions:
Customize the colors to match your brand by changing the HEX codes
Select “Copy Code”
Select “Settings” from your website Dashboard
Select Developer Tools > Code Injection
Paste the code in the Header Code Injection
Select “Save”
After you select “Save” you’ll see the widget appear in the lower right corner of your website like magic!
Are You Using a Scheduler On Your Website?
Do you use Calendly? Acuity? Something industry specific? How do you like it? I’d love to hear about it! Share in the comments.
If you liked this post, you’ll LOVE these:
This page contains affiliate links
My Insta
@jenxwebdesign
Like this post?
