Whenever my clients are looking for an appointment scheduler for their WordPress site, I always recommend Calendly. Calendly allows you to sync up to six calendars, which allows my clients to organize their scheduling system without missing a beat or double booking.
Calendly goes over all your schedules and automagically figures out your availability. Or you can simply choose a selection of days to be available. Calendly has a forever free version as well as a paid one. For the purpose of this tutorial, I’ll be using the free version.
After you create your meeting Calendly gives you a URL to share as well as three options to embed it into your WordPress site. Let me show you how to embed Calendly in WordPress quickly & easily.
How to Embed Calendly in WordPress
Log into your account, after creating your Calendly meeting, you’ll need to get the HTML code. You can access it by clicking on the gear icon (top right corner) on the meeting you want to embed then click on “Add to Website”.
After clicking on “Add to Website”, a new popup window with three options will appear. Inline Embed, Popup Widget, and Popup Text.
- Inline embed: embed the form itself on the page. Calendly will appear on any pages or posts you add the embedded HTML code to.
- Popup Widget: Adds a small blue box in the right bottom corner. The code itself will be added to a WordPress widget.
- Popup Text: Adds a customizable text link to your site, when clicked it will launch Calendly as a popup.
As you can see Calendly can be embedded anywhere on your site, Isn’t that great? Your clients can book a meeting without ever leaving your site. In this tutorial, we’ll focus on “Inline Embed”.
After customizing the page settings (more options available in the Pro version), click on the blue button “Copy Code”, to copy the code and paste it on your WordPress site.
Embed Calendly into a Page or a Post
As I mentioned earlier, you can add the embedded Calendly HTML code to any pages, posts, or widgets. Follow these steps to embed it on any individual posts or pages.
- In your WordPress admin area, Select Pages, go to the page you would like to add the code, and click on the + icon to select a new block. You can search “HTML” and Custom HTML blocks will show up.
- Choose custom HTML and paste the code you copied from the Calendly account. Make sure everything looks good and save the changes.
And that’s it! You did it 🙂 But you can always reach out if you want me to do it for you.
Take a look at the page and you’ll see the working Calendly scheduler. Do you use a scheduler? Are you using Calendly?
Leave a Reply