Skip to main content

Adding Calendly to Your Landing Page

Let your visitors easily schedule appointments!

Written by Jelle Graafstal
Updated today

If you offer services on your website, such as a free intake call or a strategy session, you will likely want to work with a scheduling tool.

Via the Calendly widget, you can easily let your visitors book appointments based on your availability! πŸ“…

ℹ️ Make sure you have created a Calendly account and an event before continuing with the steps below.


What is Calendly?

Calendly is an online tool that makes scheduling appointments simple and efficient. With Calendly, you share your availability via a personal link, allowing others to easily choose a time slot that works for both parties. This prevents back-and-forth emails to find a suitable time and integrates with various calendars and software to automatically update scheduled appointments.


Getting the embed code

To embed your Calendly calendar on your landing page, you need the embed code. You can retrieve this within Calendly at the event.

Click the three dots next to your event and select Add to website:

Choose one of the following options:

Copy the embed code:

You now add the embed code to your Plug&Pay landing page.


Adding the embed code to your landing page

Add a new element to your landing page via the plus icon at the top left. Choose embed and drag the element to the desired position on your page.

Click on the embed element to add the code. Paste the code you copied from Calendly here.

After saving the changes, the Calendly calendar will be displayed neatly on your landing page, ready for visitors to schedule! 🀩


Using the popup widget

Calendly also offers the option to use the Calendly widget as a floating button on your site. Visitors can use the button to easily schedule an appointment. Handy when you offer a free introductory call!

Choose the popup widget option in Calendly:

Optionally adjust the button text and button colour here, and copy the embed code:

Open the settings of your landing page and add the embed code as a custom script.

Click on add script:

Give your script a name and paste the embed code from Calendly.

Save the script in the <head> tag of the website and as a functional script.

Don't forget to save your landing page!

Did this answer your question?