Revset
Book a Free Audit

30-minute call · No obligation

HomeGHL HubCalendars & AppointmentsHow to Display Multiple GoHighLevel Calendars on One Page
REVSET LABS · EXPERT GUIDE·Calendars & Appointments

How to Display Multiple GoHighLevel Calendars on One Page

925 words·4 min read·Updated 27 April 2026·beginner·
Arsalan ZaffarArsalan ZaffarLinkedIn

👉 Start your 30-day GoHighLevel free trial.

Start 30-Day Free Trial
Quick Answer

To display multiple GoHighLevel calendars on a single page without using a calendar group, you will modify the calendar embed code by adding multiple calendar IDs. This process involves copying individual calendar IDs and combining them within a single custom HTML element on your funnel or website page. The entire setup typically takes about 5-10 minutes.

Key Takeaways
  • Always test your calendar display on both desktop and mobile devices after making changes.
  • Use descriptive names for your individual calendars to easily identify their IDs during the setup process.
  • Keep a backup of your original embed codes or funnel page versions before making modifications.
  • The URL modification method is best for direct links, while the embed method is for on-page display.
  • Ensure each calendar ID is separated by a comma within the embed code or URL for correct display.

Why Display Multiple Calendars Without a Group?

GoHighLevel's calendar groups are excellent for combining multiple team members or services under one booking link. However, there are times when you need more granular control or wish to display specific, unrelated calendars together without the group's pre-defined structure. This guide shows you how to achieve this flexibility, whether you want to share a direct link or embed multiple calendars directly onto a page.

Method 1: Displaying Multiple Calendars via a Single URL

This method is ideal when you want to share a single link that presents multiple individual calendars for selection. It's perfect for email campaigns, social media posts, or direct messaging where you don't need to embed the calendars onto a website page.

1
Open Individual Calendar LinksAccess your GoHighLevel account and navigate to Calendars. For each calendar you want to display, click the 'Get Link' icon to open its unique booking page in a new browser tab.
2
Identify and Copy Calendar IDsIn each new tab, look at the URL in your browser's address bar. Find the unique string of characters after `/appointments/widget/` and before the next `/` or `?`. This is your calendar ID. Copy the ID for each calendar.
3
Combine Calendar IDs in One URLChoose one of the opened calendar URLs as your base. In its URL, locate its calendar ID. Add a comma (`,`) immediately after this ID, then paste the ID of your second calendar. Repeat this process, adding a comma and the next calendar ID for every additional calendar you wish to include.
4
Reload and Test the Combined URLAfter adding all desired calendar IDs, press Enter to reload the page with the modified URL. You should now see a single page displaying all selected calendars for your customer to choose from. Verify that all calendars appear correctly.

⚠️ Ensure there are no spaces before or after the commas separating calendar IDs in the URL. Incorrect formatting will prevent the calendars from loading properly.

✅ Example URL structure: `https://[yourdomain.com]/appointments/widget/CALENDAR_ID_1,CALENDAR_ID_2,CALENDAR_ID_3`

🔥 Pro Tip

Bookmark this combined URL for quick access and sharing. This saves you from recreating it each time you need to share these specific calendars.

Try GoHighLevel Free

Start your 30-day GoHighLevel free trial

Everything in this guide is in your free trial. 30 days, no credit card — the platform behind 78+ revenue systems.

Start 30-Day Free Trial

Some links are affiliate links — if you sign up we may earn a commission, at no extra cost to you. We only recommend GoHighLevel because we build on it every day.

Method 2: Embedding Multiple Calendars on a Funnel or Website Page

This is the primary method for integrating multiple GoHighLevel calendars directly into your GoHighLevel funnel or website pages. It offers a seamless user experience by allowing visitors to select a calendar without leaving your page. This approach requires modifying the standard calendar embed code.

1
Access Calendar SettingsLog in to your GoHighLevel account. From the main dashboard, go to Settings in the left sidebar, then click on Calendars.
2
Copy Embed Code for Your First CalendarLocate the first calendar you want to embed. Click the 'Get Embed Code' button associated with it. A pop-up will appear; copy the entire embed code provided.
3
Navigate to Your Funnel or Website PageIn a new tab, go to Sites → Funnels or Sites → Websites, depending on where you want to embed the calendars. Select the specific funnel or website and then click to edit the desired page.
4
Add a Custom JS/HTML ElementWithin the page editor, drag and drop a Custom JS/HTML element from the elements sidebar into the section where you want your calendars to appear. This element will house your modified embed code.
5
Paste the First Calendar's Embed CodeClick on the newly added Custom JS/HTML element. In the sidebar, click 'Open Code Editor'. Paste the embed code you copied for your first calendar into this editor.
6
Retrieve IDs for Additional CalendarsReturn to your Settings → Calendars tab. For each additional calendar you wish to embed, select its name from the dropdown or locate its entry. Copy its unique calendar ID, which is typically found within the embed code or URL.
7
Modify the Embed Code to Include Multiple IDsGo back to the funnel page editor with your Custom JS/HTML element's code editor open. Within the embed code, locate the `calendar_id` parameter. This parameter holds the ID of your first calendar. Add a comma (`,`) immediately after the existing calendar ID, then paste the ID of your second calendar. Repeat this for all subsequent calendar IDs you want to include.
8
Save the Code Editor ChangesAfter adding all desired calendar IDs, click the 'Yes, save.' button within the Custom JS/HTML element's code editor to apply your modifications.
9
Save Your Page and PreviewClick the 'Save' button in the top right corner of the page editor to save your funnel or website page. Then, click 'Preview' to open the live page and verify that all your selected calendars are displayed correctly within the widget.

⚠️ Always make a full backup of your funnel or website page before making extensive code modifications. This ensures you can revert to a working version if any issues arise.

✅ The `calendar_id` parameter in your embed code will look like this: `calendar_id: 'CALENDAR_ID_1,CALENDAR_ID_2,CALENDAR_ID_3'`

🔥 Pro Tip

For easier management, consider using a text editor to assemble your combined calendar IDs before pasting them into GoHighLevel's code editor. This helps prevent errors.

Troubleshooting Common Issues

Even with careful steps, you might encounter issues when setting up multiple calendars. Here are common problems and their direct solutions.

Troubleshooting Common Issues

⚠️ Calendars are not appearing at all on the page or link.
Check for typos in your calendar IDs. Ensure all IDs are correctly formatted and separated by commas without extra spaces. Also, verify that the calendar is published and active in GoHighLevel.
⚠️ Only one calendar is showing, even though I added multiple IDs.
Review your embed code or URL. Confirm that each calendar ID is properly separated by a comma (`,`) and there are no missing commas or incorrect characters between them. The format should be `ID1,ID2,ID3`.
⚠️ I see an 'Invalid Calendar ID' or similar error message.
One or more of your copied calendar IDs might be incorrect or belong to a deleted calendar. Go back to Settings → Calendars and re-copy each ID carefully to ensure accuracy.
⚠️ The embedded calendars look unstyled or broken.
Ensure you copied the *entire* embed code, including the `