Make a Divi Button Popup a Calendly Widget

|

Calendly lets you manage your calendar and appointment scheduling. It includes an option to embed widgets within your website. While Calendly includes the option of embedding a popup, if you want the popup to be triggered by a Divi button, here's a way to do it.

Display a Calendly Widget in a Popup using Divi Shortcode Popup Module

You can create a Divi button which pops up a Calendly widget, as follows:

1. Install Divi Shortcode Popup Module – this lets you display any shortcode in a popup triggered by a Divi-style button.

2. Install Embed Calendly – a free plugin which generates a shortcode for Calendly widgets

3. Get your embed link from Calendly, e.g:

 

4. Add a "Shortcode Popup" module to your page, including your Calendly link in a shortcode like so:

5. (Optional) Add this CSS code into the "Divi > Theme Options > General > Custom CSS" box, as it will improve the look of the final popup:

.et_pb_db_shortcode_popup_popup_inner {
    overflow-y: initial !important;
}
.et_pb_db_shortcode_popup_popup_inner #calendly-inline-widget {
    min-height: 80vh;
}

6. Now view the page on the front-end and click the Divi Shortcode Popup button and you should see your Calendly widget displayed like so:

This post may contain referral links which may earn a commission for this site

Divi Booster

Hundreds of new features for Divi
in one easy-to-use plugin

0 Comments

Submit a Comment

Your email address will not be published.