---
title: "Calendly Integration"
description: "Learn how to integrate your Calendly account to your GroupApp community"
url: https://help.group.app/en/articles/152-calendly-integration
collection: "Integrations"
updated: 2026-08-21
language: en
---

# Calendly Integration

Learn how to integrate your Calendly account to your GroupApp community

Easily integrate Calendly with your GroupApp landing pages to streamline scheduling and boost engagement. When connected, your Calendly event that you choose to show when creating the landing page form will automatically sync and display as a booking card directly on your landing page form.

## Use Case

After a member completes a membership purchase, RSVPs to an event, or clicks a call-to-action on the landing page, a calendar form automatically opens, seamlessly displaying your real-time availability via Calendly. Without leaving the page, users can instantly book a meeting during time slots you've pre-set, making scheduling effortless and intuitive.

![](https://staticfiles.gleap.io/gattachments/3xD5WFBG3xapEYUqp2cO8e1F756c3AA8Q8eKd6tYsp1pHfAheiRAbcoy0VrRJExoBJZPq1F3RnT.png)

## How to Integrate With Your Calendly Account

**Step 1:** Click the **Admin Panel** button.

![](https://staticfiles.gleap.io/gattachments/qUJfhhP8mDBPVOYvudEOd64NmiXrojVGJ8qlO0b7Bt6HSxByQ2SL8nxxCG7eX4PcVJeVGTOyTby.png)

  
**Step 2:** Go to **Settings & Data** at the bottom of the side menu and select **Integrations.**

![](https://staticfiles.gleap.io/gattachments/fnYfyTFBmTo2sMioCBkWuTxIlFp3RPIIy0xhIVkvD23yJoBduw1RQJbp2NnVtCWTDWVmeiaTBIj.png)

  
**Step 3:** Click **Connect Calendly**

![](https://staticfiles.gleap.io/gattachments/US5pdT8oiQstGSDaoz6PUC9exW349dmDfbS6BI3GoCxIfWQnBnnDeYlc6XRMLx1RlplRxTHYt8y.png)

  
**Step 4:** Complete the process of logging in to your Calendly account. After the process is successful, you will be redirected back to your community

![](https://staticfiles.gleap.io/gattachments/aCRjLcA8VFlwYSCcKTX9O6woTNEV26SId1XisvgeCnsH8GZGZMztjnst2TKZRq35Wz8s8C86M3N.png)

## How to Set Up a Calendar Widget Form on a Landing Page

**Step 1**: Navigate to the landing pages and use an existing one by clicking on the name of the landing page from the list to open the builder for editing, or create a new one by clicking the add new page button

![](https://staticfiles.gleap.io/gattachments/etbAWbuki5hY5sRWeKHqVIEAPQ8r5IAg1E80O3NcZMsBVwF2p57VOWxKrLqGl61bvMXS1BFOV8H.png)

**Step 2:** Click the Widgets icon, then add a new widget

![](https://staticfiles.gleap.io/gattachments/kqpIwNgGXpS93EFi2XiEVjvgJRu9dzyEG8M5IVRnyGNRTdmbAYL2Ol2Aze2EoUONONFSrZBFLhG.png)

  
**Step 3:** Select the **Scheduler App** option and click **Add** to add it to the page

![](https://staticfiles.gleap.io/gattachments/0Slkl3KRjUORucrB0QjXtbe2CJkGKEwlSetooTtF4AbJ7OjXgVQGnmL8sbAfE5SzlZeR51SvOhr.png)

**Step 4:** Choose Event as the calendar type, and this will show the available events from your Calendly account in the Event drop-down.

![](https://staticfiles.gleap.io/gattachments/kNBUsH7C9LjVwyLYGK8Nvb8xEgvNRkGH5r46GYKhJNeTlrmf6QKKY5iODx6PRrvbvLvvj8PCWna.png)

  
**Step 5:** Select the event you want to use

![](https://staticfiles.gleap.io/gattachments/3xND0A0OSkZBhgjTv6MHSv2iDVpOZCscAnPOw573hYN70uWlE36Ex5Mnb42Vn4EjwzBt7VDKvpy.png)

**Step 6: S**tyle the widget form background color, title, and description text from the widget styles tab

![](https://staticfiles.gleap.io/gattachments/9WCOkSvQ6SLqtPo6uPG7QRIcvLUqM7G1PcbtUEqzrcDeFmuZBhSG5Z5a8K2GVHKv03XDs2FXTsA.png)

  
**Step 7:** Close the widget option and locate the CTA button on the page that you would want to open up the widget. If you don’t have one, you can add a CTA button on the page. Example

![](https://staticfiles.gleap.io/gattachments/zgSFokdv7oQsSzKB7jqK0VQzZNJ3UmZcPjePBjWRlSJE3TRh5IjtTzS9yyk7yDbdYhhoW7qbopQ.png)

  
**Step 8:** Edit the button action and choose the option to Trigger a widget, and choose the widget from the pop-up dropdown. When someone clicks on the button, it will open the calendar widget form

![](https://staticfiles.gleap.io/gattachments/8G2avzaTBp3vu4AykviAvOg80c8b4nmHb8Uc7LRIdutuS4WqJ3cyptOeF7h9etX7ysISAvKOAvm.png)

**Step 9:** Click the save button and preview the changes. Once you are ready, you can update the changes on the live page.

![](https://staticfiles.gleap.io/gattachments/jqsMq9CQdDRuH0SSNhTzd2JdsuBlTOosXZ1BnLT4CL1Jt7K7TcyVR2TFOUJXQGEIMiWIuvQQnaD.png)