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· 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 Links — Access 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 IDs — In 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 URL — Choose 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 URL — After 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 Settings — Log 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 Calendar — Locate 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 Page — In 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 Element — Within 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 Code — Click 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 Calendars — Return 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 IDs — Go 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 Changes — After 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 Preview — Click 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 `