How to Embed Calendly in WordPress? 2 Easy Ways!

Are you looking for the easiest way to integrate Calendly onto your website and make the most of your appointment management tool? Then you’ve come to the right place. In this guide, you’ll learn how to embed Calendly in WordPress using 2 different methods.

What’s Calendly?

One of the most popular tools a lot of businesses use for their client services these days is an appointment scheduling tool. Whether you’re running clinics, consultancies, or other types of business, a little appointment calendar tool can go a long way to helping you run everything smoothly. Calendly, in particular, is one of the most famous tools available out there. It provides users with an easy way to schedule appointments directly without using emails. Simply set up a few rules for your meetings and events and embed them onto your website. Your users can easily view this scheduling calendar, sign up for your services directly, and even check when you’re next available.

Managing your appointment calendar has never been easier. The appointment scheduler is extremely flexible, and you can even add cool functions like buffer times, secret events, and even disable last-minute appointments. Additionally, you can integrate them with your cloud tools like Google, Outlook, iCloud, and Office 365 and even enable team-based operations on your scheduler. Calendly also comes with fantastic integration options with other popular software such as Zoom, PayPal, Google Analytics, and many others.

Why embed Calendly in WordPress?

embed calendly in wordpress - calendly main image

With a Calendly WordPress embed, you get the most out of both your website and Calendly. Your users can view your services and directly sign up with no hassle. Allow your website’s leads to work perfectly with your services by adding little pop-up embeds on your pages/posts or even add a Calendly embed on your sidebar. You can also add an appointment calendar and additional information regarding your schedules. With an embed, your website visitors can sign up for important meetings or events directly as well. Change your website’s leads and make dealing with business partners, customers, or consultees much easier with a more integrated scheduler for your site.

But that’s not all. Calendly comes with a seamless integration option that works perfectly with WordPress too. You can easily enjoy three different types of embeds, each with their fair share of advantages. And all the embeds are fully customizable! You can edit everything from the text to embed color options to give it the look and feel of your site.

So, let’s go ahead and check out how you can embed Calendly in WordPress.

Embed Calendly on your WordPress site

Calendly allows you to embed your appointment calendars in 3 different ways:

  • Inline Embed
  • Pop-up widget
  • Pop-up text

However, the ways to embed them onto your WordPress website are identical.

First, you’ll need to log in to your Calendly account and open the event types page. Hover over the event that you want to embed, click on the Settings icon, and then Add to the website.

embed calendly in wordpress - events type

embed calendly in wordpress - add to website

Now, you’ll be given three different options for embed Calendly onto your WordPress website. You can choose between an Inline Embed, a Pop-up widget, and a simple Popup text. Each one of these has some pros and cons.

1) Inline Embed

Using the Inline widget, you can show your entire appointment calendar that shows your available days. This embed works exceptionally well using widgets too. Display your Calendly widget on your sidebar, and you can easily show what days you’re available and your available events all over your website.

2) Pop-up Widget

The Pop-up box widget adds a little customizable button on the bottom on your webpage that’s very minimal. Clicking on the button gives you a pop-up that shows your appointment calendar in a little lightbox. This is a great option if you want to add a little pop-up on your entire website or specific pages/posts.

3) Pop-up Text

The Popup text widget simply gives you a little customizable text that opens your appointment calendar using a pop-up. This widget is the most minimal and flexible option, but also the least noticeable. Try it out as a little link to various posts or pages just to give your viewers information regarding your availability and much more.

Once you click on Continue, you’ll see the code that you can copy to embed the widgets on your website. You’ll also see the option to customize the widget on the left. Click on the Copy Code button to copy the code to your clipboard.

Now, we’ll be showing you how to embed Calendly in WordPress pages/posts and the sidebar. Each one works for different purposes, whether you want to display your Calendly embed in specific pages/posts, on your sidebar, or all over your website. So let’s get right into the tutorial!

1) Embed Calendly in WordPress Pages/Posts

The simplest way to Embed Calendly on your WordPress pages/posts is to use the Embed block. To do this, first, choose your embed widget type and customize it selecting the background, text, and button color. Then click the Copy code button.

embed calendly in wordpress - code code for widget

After that, open the page/post that you want to place your Calendly embed in. Then, click on the Add new block button and search for the Custom HTML block. Click on it and then simply paste the embed code onto the HTML block.

Once you save/publish your post, the Embed should show up with the rest of the post’s content.

2) Embed Calendly in WordPress Sidebar

To embed Calendly in your WordPress website’s sidebar, you’ll need to use the Custom HTML widget. For that, get the Embed code from your Calendly account. To do that, click on Add to Website on the event’s setting, and customize the background, text, and button color. Then click on Copy code to copy the HTML code to your clipboard.

Now, open your widget customizer by clicking on Appearance > Widgets. Then, press the Custom HTML widget under Display the customer shopping cart. Choose the sidebar as your widget location, and it’ll be added to the sidebar column on the right.

After that, click on the Custom HTML widget that you just added to the sidebar. Change the Title of the widget and paste the embed HTML that you just copied. Then click Save, and the widget will show up on your sidebar.

embed calendly in wordpress - calendly sidebar

Conclusion

And that ends our tutorial on how to embed Calendly in WordPress. Remember that you can choose to embed the calendar in posts/pages or the sidebar, but the idea behind both methods is identical. Just follow these steps:

  • Copy your Widget embed code from your Calendly account.
  • Paste the code onto a Custom HTML block for your posts/pages or the Custom HTML widget if you want to add it as a widget.

If you run into any issue during the whole embedding process, let us know, and we’ll get right into it. Moreover, if this article helped you out, let us know! We’re always happy to hear from you.

Finally, we recommend you check out our tutorial on how to integrate Eventbrite with WordPress to make the most of your business.