How to Display Multiple Calendars

  • Home
  • How to Display Multiple Calendars

You may want to display multiple calendars for a variety of reasons. Maybe you have different types or lengths of appointments and want to provide multiple options to your customers. Follow these directions to learn about the two ways to display multiple calendars:

Part 1: How to Embed Multiple Calendars on a Funnel Page

Step 1: Navigate to Settings > Calendars > Calendar Code.

Step 2: Copy the embed code from the first calendar.

Step 3: Navigate to the funnel page, and under add a “Custom JS/HTML” element, click “Open Code Editor”.

Step 4: Paste the calendar embed code.

Step 5: Navigate back to Navigate to Settings > Calendars > Calendar Code, and choose the second calendar from the calendar name dropdown.

Step 6: Copy the calendar ID from the second calendar.

Step 7: Return to the funnel page tab that has your Custom JS/HTML element code editor open, add a comma after the first calendar ID and paste the second calendar ID.

Step 8: Hit “Yes, save.”

Step 9: Save your funnel page and preview.

Part 2: Use Calendar Links to Provide a Dropdown in the Calendar Link

Step 1: Open the calendar links in a new tab by clicking the hyperlinks for each calendar you wish to use.

Step 2:  Copy the calendar ID from one calendar URL, and paste it into the other calendar URL separating the two with a comma.

  • Calendar 1: link.YOURWEBSITE.com/widget/booking/ALPHANUMERICCODE#1
  • Calendar 2: link.YOURWEBSITE.com/widget/booking/ALPHANUMERICCODE#2
  • Combined calendar links: link.YOURWEBSITE.com/widget/booking/ALPHANUMERICCODE#1,ALPHANUMERICCODE#2

Step 3: Press Enter to reload the page.

Step 4: You can then use this link in an email:

       link.YOURWEBSITE.com/widget/booking/ALPHANUMERICCODE#1,ALPHANUMERICCODE#2

The dropdown will allow your customer to choose between multiple calendars.

Leave a Reply