Join

Calendly Booking for Single Listings and MyListing Websites

  • Guides reflect how I’m currently using the solution for myself and my clients. 
  • If I don’t cover a specific feature, it implies I’m not using it.
  • If I don’t cover a specific setting, it implies the defaults are acceptable or the options are obvious.

This guide will show you how to easily add calendaring functionality to your MyListing website without using a plugin. We’ll also talk about ways for MyListing website owners to add more value to their Listing Packages.

This is done with Calendly, a powerful yet easy-to-use solution for appointments, consultations, meetings, interviews, etc., and their Basic (FREE) plan, which is adequate for many businesses. ​

Calendly Booking for MyListing

There are a lot of folks looking to add Booking functionality to their MyListing websites, and the search for the right solution can get pretty confusing. Which solutions are compatible with MyListing? Of those, which are the best?

On top of the complexity, there is also the cost, as Booking solutions can get pretty expensive by the time it’s all said and done. There’s the cost of the solution itself, the time that you put in yourself, and any time/money spent on hiring someone to help you.

Enter Calendly, which is not only FREE to get started but also puts responsibility and control into the hands of your users. But why would I want that?

Depending on your stage of building your business, providing a booking solution may not be within your budget, or you may have more pressing things on your to-do list. Having the ability to quickly drop in Calendly is a slam dunk.

Lastly, depending on your business model, skill set, and overall desire to do so, you could offer services that help your users upgrade and implement the paid versions of Calendly.

Benefits of Using Calendly with MyListing

  • No plugin is required.
  • Minimal website complexity to manage compared to a Booking plugin.
  • Minimal website performance hit compared to a Booking plugin.
  • No cost to implement on your website for your own needs.
  • No cost for your users with the available FREE plan.
  • Opportunity to sell Calendly implementation services to supplement your income.

Calendly for Single Listings

Enable Calendly Integration

The Enable Calendly Integration code snippet is used to allow the embedding of a Calendly profile into a MyListing website. Once this snippet is in place, we can embed a Calendly profile in various areas, including Single Listings, Elementor Pro Popups, and more.

add_action( 'wp_head', function () { ?>

<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js" defer></script>

<?php }

Collect Calendly Profiles

Use the steps below to add a Calendly field to each Listing Type where you want to collect and display a Calendly profile.

  1. Listing Types > Edit Listing Type > Fields.
  2. Add a URL field.
  3. Give it a label of “Calendly Booking Profile” or similar.
  4. Give it a placeholder of “https://calendly.com/yourprofilename” or similar.
  5. Give it a description of “Note: If you use Calendly to book appointments or would like to start, you can enter your profile link here. Calendly offers a FREE account to get started.” or similar.
  6. Continue configuring the field as desired such as setting it required/optional, package visibility, etc.
  7. Save the changes to your Listing Type.

Calendly – Quick Action

If you wish to add a Quick Action that links to a user’s Calendly profile, please use the following steps.

  1. Listing Types > Edit Listing Type > Single Page > Quick Actions.
  2. Under the Add new quick action column, choose Custom action.
  3. Set the desired icon and label.
  4. For the Link to value, enter the [[calendly-booking-profile]] shortcode.
  5. Save the changes to your Listing Type.

Calendly – Shortcode Block

If you wish to embed a user’s Calendly profile into an existing or new Single Listing tab, please use the following steps.

  1. Listing Types > Edit Listing Type > Single Page > Content & Tabs > Edit the desired Tab.
  2. Add a new block > Select block type > Shortcode.
  3. Grab the “Embed Calendly Profile” code snippet from the next section and paste it into this shortcode block.
  4. Save the changes to your Listing Type.

Embed Calendly Profile

This code snippet allows Calendly profiles to be embedded into various areas of a MyListing website (e.g., Single Listings Content & Tabs, Elementor Pro Popups).

<!-- Calendly inline widget begin -->
<div class="calendly-inline-widget" data-url="[[calendly-booking-profile]]" style="min-width:320px;height:400px"></div>
<!-- Calendly inline widget end -->

Calendly for MyListing Website Owners

To this point, we’ve covered how Calendly works with Single Listings and the value it brings to listing owners. Website owners can also directly benefit from using Calendly.

Here are just some of the ways Calendly can be used by MyListing website owners and depending on the website’s audience or niche, the opportunities may become even more readily apparent.

  • Schedule support consultations with current users.
  • Schedule pre-sales consultations with potential customers.
  • Schedule meetings with potential vendors of your platform.
  • Schedule advisement meetings with students.
  • Schedule interviews.

Integrate Calendly – Direct

In the ‘Calendly—Shortcode Block’ section above, we showed how Calendly looks when using the ‘Inline Embed’ option. Additional options are available directly from Calendly.

Integrate Calendly – Elementor Pro

While Calendly offers nice options for adding their solution to a WordPress website, it’s a bit limited compared to what’s possible with Elementor Pro popups. In short, popups allow you to add animation, display conditions, display triggers, and other advanced display rules.

When working with Elementor Pro popups, we can embed our Calendly code snippet directly into our popup, allowing users to interact with Calendly without having to view a profile on the Calendly website.

Another option is to simply add a link or linked button to a popup that then links out the profile on the Calendly website.

As you can see below, we have several options regarding the configuration of the Elementor popups.

  • Animation: Popups can slide in/out/up/down, stick to the side of the page, take over the entire screen, etc.
  • Conditions: Popups can be applied to all pages/posts, select pages/posts, WooCommerce store, etc.
  • Triggers: Popups can show up when the page loads, when a user scrolls up/down, when a user goes to exit a post/page, etc.
  • Advanced Rules: Popups can show up when a post/page is viewed “x” number of times, when users arrive from a particular website, on certain devices, etc.

Video Tutorial

Youtube video