Calendly Block

Jetpack’s Calendly block allows your visitors to schedule one-on-one appointments, group events, and team meetings directly from your website.

Requirements

You will need a free Calendly account to use this block. If you do not have a Calendly account, sign up here for free.

Inserting a Calendly Block

You can add the Calendly block by searching and/or selecting it from the Jetpack section of the block selector:

See Jetpack Blocks for detailed instructions on adding blocks.

Configuring a Calendly Block

To configure the block, you will need to enter your Calendly web address or embed code. If you need help locating your embed code, follow these steps from Calendly to find it.

Block Toolbar

Click the block to display the block toolbar. The Calendly block offers the following options in its toolbar:

The Calendly block toolbar has the following options:

• Alignment (left, center, or right)
• Style (more on that below)

Calendly Block Settings

When the Calendly block is selected, you’ll see the following options in the block toolbar:

The Styles options allow you to select between:

• Inline embeds a calendar directly onto your page for your visitors to interact with.
• Link inserts a button for your visitors to click. This will open a pop-up calendar.

If you choose the Link style, clicking on the button in your block editor will open up several more block options.

You can customize the button style, choosing either fill (where color will fill the button) or outline (creating a colored border around the button):

You can customize the background color and text color of the button as well as the border radius. The background color has two options: solid and gradient:

Calendar Settings

The Calendar Settings let you change the Calendly link or code you have embedded.

Activating Hide Event Type Details will hide your calendar’s title.

Because this is an embed, you’ll manage most of the settings in Calendly. You can click the link at the bottom of the Calendar Settings section to learn more about managing the calendar’s colors.

Advanced

The advanced tab lets you add a CSS class to your block, allowing you to write custom CSS and style the block as you see fit.

Troubleshooting

If you’re having any trouble with the Calendly block, please contact support for help.

Privacy Information

This feature is activated by default. It cannot be deactivated, the Calendly block is always available in the Block Selector.

Data Used
Site Owners / Users None.	Site Visitors None.
Activity Tracked
Site Owners / Users None.	Site Visitors None.
Data Synced (Read More)
Site Owners / Users We sync options that identify whether or not the feature is activated and how its available settings are configured.	Site Visitors None.