How to embed Calendly
In this guide, I'll show you how to embed Calendly on your website.
Calendly is an efficient appointment scheduling service that takes the hassle out of emailing. Calendly makes scheduling easy by only suggesting times that work for your availability across all your calendars.
Unicorn Platform allows you to embed Calendly on your website in a few minutes 🙂
To embed Calendly on your site, you should create an event there. You may choose the type of event that suits you.
Then, to embed the schedule, you should use the sharing option.
There are three ways to embed Calendly on your site: add a schedule on a page of a site, add a floating button that opens a popup and add a text link that opens a popup.
Once you have chosen the embed type, you can customize the appearance of the schedule. And also you will find an embed code that you have to copy.
Then you have to insert a Custom HTML component where you want your Calendly schedule to appear.
Next, in the editor of this component, you should paste the embed code.
Make sure you save your changes and that's it! Calendly schedule is embedded on your website!
There is a floating button on the page. When it's clicked, a pop-up window with the schedule appears.
To embed the popup widget on your site, you should select this option and copy the provided embed code.
Paste the copied code into </body> custom HTML code on Site settings > Custom code
And that's all. A floating button will appear on your site.
To embed text popup on your page, you should select this option and copy the part of the code as highlighted in the picture:
Next, paste this part of code into the Site settings > Custom code > </body> custom HTML code
Then copy the other part of the code which is highlighted in the picture. It starts with onclick and ends with false;"
Now pick the button that should trigger the pop up when clicked. Open Edit component and click on a "gear" icon:
Then on the Settings tab paste the code into the Attributes field:
Here we are! Now when you click on this button, a scheduling form will appear.
Calendly is an efficient appointment scheduling service that takes the hassle out of emailing. Calendly makes scheduling easy by only suggesting times that work for your availability across all your calendars.
Unicorn Platform allows you to embed Calendly on your website in a few minutes 🙂
To embed Calendly on your site, you should create an event there. You may choose the type of event that suits you.
Then, to embed the schedule, you should use the sharing option.
There are three ways to embed Calendly on your site: add a schedule on a page of a site, add a floating button that opens a popup and add a text link that opens a popup.
Embed inline
Once you have chosen the embed type, you can customize the appearance of the schedule. And also you will find an embed code that you have to copy.
Then you have to insert a Custom HTML component where you want your Calendly schedule to appear.
Next, in the editor of this component, you should paste the embed code.
Make sure you save your changes and that's it! Calendly schedule is embedded on your website!
Widget popup
There is a floating button on the page. When it's clicked, a pop-up window with the schedule appears.
To embed the popup widget on your site, you should select this option and copy the provided embed code.
Paste the copied code into </body> custom HTML code on Site settings > Custom code
And that's all. A floating button will appear on your site.
Text popup
To embed text popup on your page, you should select this option and copy the part of the code as highlighted in the picture:
Next, paste this part of code into the Site settings > Custom code > </body> custom HTML code
Then copy the other part of the code which is highlighted in the picture. It starts with onclick and ends with false;"
Now pick the button that should trigger the pop up when clicked. Open Edit component and click on a "gear" icon:
Then on the Settings tab paste the code into the Attributes field:
Here we are! Now when you click on this button, a scheduling form will appear.
Updated on: 03/03/2022
Thank you!