> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://help.unicornplatform.com/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # 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. ![Creating an event on Calendly](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/helpdesk-crisp-2022-03-02-11-5_1h2ng8y.png) Then, to embed the schedule, you should use the sharing option. ![Sharing option on Calendly](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/calendly-2022-03-02-11-54-44_1q9bdf9.png) 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. ![Options for adding Calendly on a page of a site](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/calendly-2022-03-01-14-47-53_1u2pvhr.png) # 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. ![Appearance settings and code for inline embed on the page](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/helpdesk-crisp-2022-03-02-12-5_10g89jm.png) Then you have to insert a **Custom HTML** component where you want your Calendly schedule to appear. ![Component for Custom HTML adding](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/unicorn-platform-builder-2022-_1bcvzul.png) Next, in the editor of this component, you should paste the embed code. ![Inserting code to embed in custom HTML component](https://storage.crisp.chat/users/helpdesk/website/-/7/e/7/8/7e782a40c0560c00/screenshot-2025-07-18-105334_1k5qq9v.png) Make sure you save your changes and that's it! Calendly schedule is embedded on your website! ![Inline Сalendly on a website page](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/write-notes-more-wax-2022-03-0_fuzqyo.png) # Widget popup There is a floating button on the page. When it's clicked, a pop-up window with the schedule appears. ![Popup widget button by Calendly](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/write-notes-more-wax-2022-03-0_l8pxqk.png) To embed the popup widget on your site, you should select this option and copy the provided embed code. ![Code for embedding a popup widget on a website](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/calendly-2022-03-01-14-09-14_bbbnq4.png) Paste the copied code into ** custom HTML code** on **Site settings** > **Custom code** ![Inserting the embed code on custom HTML code](https://storage.crisp.chat/users/helpdesk/website/-/7/e/7/8/7e782a40c0560c00/screenshot-2025-07-18-105743_17yjfi3.png) And that's all. A floating button will appear on your site. ![The floating button by Calendly on the website](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/screencast-2022-03-02-12-40-35_1omqhb1.gif) # 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: ![Embed code for text popup](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/calendly-2022-03-02-08-34-27_rzov01.png) Next, paste this part of code into the **General settings** > Global ** HTML code** ![](https://storage.crisp.chat/users/helpdesk/website/-/7/e/7/8/7e782a40c0560c00/screenshot-2025-07-18-104952_18i7bbu.png) Then copy the other part of the code which is highlighted in the picture. It starts with `onclick` and ends with `false;"` ![The second part of the code](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/helpdesk-crisp-2022-03-02-12-4_56d62v.png) Now pick the button that should trigger the pop up when clicked. Open **Edit component** and click on a "gear" icon: ![Editing the button](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/unicorn-platform-builder-2022-_trock7.png) Then on the **Settings** tab paste the code into the **Attributes** field: ![Button actions, integrations & settings](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/unicorn-platform-builder-2022-_swhagb.png) Here we are! Now when you click on this button, a scheduling form will appear. ![Text popup widget by Calendly on the page](https://storage.crisp.chat/users/helpdesk/website/7e782a40c0560c00/write-notes-more-wax-2022-03-0_j6sl7s.png)