Embedding Calendars using HTML Code

Why Embed a Calendar?

• Embedding a calendar allows clients to book appointments directly from your external website (like WordPress, Squarespace, or Wix) without being redirected to a separate page.

Step 1: Get the Embed Code

• 1. Navigate to Calendars > Calendar Settings.
• 2. Locate the calendar you want to embed.
• 3. Click the three dots (kebab menu) next to the calendar and select 'Share'.
• 4. In the pop-up, switch to the 'Embed Code' tab.
• 5. Click 'Copy Code'.

Step 2: Paste Code on External Site

• 1. Log into your external website builder (e.g., WordPress).
• 2. Navigate to the page where you want the calendar to appear.
• 3. Add an 'HTML', 'Code', or 'Embed' block to the page.
• 4. Paste the copied iframe code into the block and save.
• [IMAGE PLACEHOLDER: Paste HTML Code]

Adjusting iframe Height/Width

• If the calendar gets cut off, you can manually adjust the 'width' and 'height' attributes inside the iframe code (e.g., change height='600px' to height='800px').

Search Tags

• Tags: calendar, embed, html, iframe, external website