Share Multiple Calendars With One Add to Calendar Button

In the AddEvent dashboard, we see users using calendars for different purposes:

• Organizational - each calendar is just a "folder" to group and manage sets of events
• Cohorts - each calendar is a set of events for a specific user or group of users
• Courses - each calendar is for a specific group of events/classes that you want a group of people to know about

Sometimes, you might want to share multiple calendars or combinations of calendars with different groups of people. You can do this in a couple of different ways:

• You can duplicate the events onto different calendars for each group of people that need to know about the event. However, this can get messy and difficult to keep in sync, especially if you want to make changes to events in the future
• You can share multiple calendars with each group of users. However, this presents a potentially bulky user experience, as the users have to click multiple add-to-calendar buttons to get all of the events onto their calendars.

A more streamlined user experience is to combine those calendars into a single calendar that users can add to their calendar with a single click of an add-to-calendar button. This functionality is built right into AddEvent (but it is a little hidden). This article shows you how to combine multiple calendars into a single view/link/button.

How does sharing multiple calendars at once work?

When an end-user subscribes to a combined calendar, it will appear as a single calendar in the list of calendars in their calendar platform. Note that only the name from the initial/first calendar used will be shown, but the events from all of the calendars will appear on the calendar.

You may want to use an empty calendar with no events on it as the first/initial calendar in order to have a more relevant name appear on the user's calendar (as the name of the first calendar might not apply to all the calendars that the user subscribes to). An alternative is to use generic names as the names of your calendars but to set a specific "internal name" within the AddEvent platform. This means that you will be able to identify the calendars internally, but your end-users will see a calendar name that is more relevant e.g., your Company name.

How to share multiple calendars at once

For each of these sharing methods, you will need to do the following steps:

1. From the AddEvent dashboard, go to the calendar page by clicking on the three dots that appear when you hover over the calendar name.
2. Scroll down to the relevant sharing method e.g. for the Embeddable calendar. You will need to scroll down on the calendar page to the "Embeddable calendar" section.

Embeddable calendar

1. Click on Quick Customize on the tile.
2. In the left-hand customization panel, scroll down to the Calendars to display section.
3. Select each of the calendars that you want to combine into the embeddable calendar from the list of calendars using the checkbox on the left-hand side. Note that you can also choose which calendars are displayed by default using the toggle beside the calendar name.
4. When a user views the embeddable calendar, they can choose which of the calendars you included to be displayed by clicking the "Calendars" button in the top right-hand corner of the embeddable calendar. All of the calendars that are displayed at the time the user subscribes will be added to the user's calendar.

Event landing page

The following two calendars are used to demonstrate how to combine multiple calendars on a calendar landing page:

• School demo calendar: https://www.addevent.com/calendar/AJ348883
• Company demo calendar: https://www.addevent.com/calendar/ih348885

1. For each calendar that you want to combine, go to the "Calendar landing page" sharing method and copy the link that is shown there.
2. Choose which calendar to be your "base" calendar (see the note on naming above) and enter the link into your browser. In this example, I will use the School calendar as the "base" calendar.
3. For the second (and each subsequent calendar), copy the final part of the link after the "/calendar/". This is the unique key of the calendar, and it should look like a combination of letters and numbers. For the company calendar above, this would be ih348885.
4. In your browser, edit the URL of the base calendar and add a dash ("-") at the end of the URL, and then paste the unique key for the second calendar. Our link now looks like https://www.addevent.com/calendar/AJ348883-ih348885. Press enter to load the page.
5. Repeat step 4 for each additional calendar that you want to combine.
6. When a user clicks the combined link, they will see all of the events for all of the calendars added. When a user subscribes to the combined calendar by clicking the add-to-calendar button, then all of the events from all of the calendars added to the link will show up on their calendar.

Add to Calendar Button

1. Click Copy next to the Add to Calendar button code for the first calendar that you want to include in the combined Add to Calendar button.
2. Note the data-id property: this is the unique key of the calendar.
3. Copy the unique key from the second calendar. You can either find this at the top of the page in the calendar information section or by looking at the code for the Add to Calendar button.
4. In the data-id property from the Add to Calendar button code for the first calendar, edit the parameter and add the second unique key alongside the first, separated by a dash ("-"). The final property should look something like this: data-id="AJ348883-ih348885"
5. Repeat steps 3 and 4 for each additional calendar that you want to add.
6. When a user subscribes to the combined calendar by clicking the Add to Calendar button, then all of the events from all of the calendars added to the data-id property will show up on their calendar.

Add to Calendar Links

1. Select a style of Add to Calendar links and then click Copy for the first calendar that you want to include in the combined Add to Calendar links.
2. Paste the links where you want to use them.
3. Click on a specific link to edit it - the exact process for doing this will depend on where the links are pasted. The link should look something like this: "https://www.addevent.com/calendar/AJ348883+google"
4. Note the combination of letters and numbers after the "/calendar/" and before "+google" - this is the unique key of the calendar. In this case, it is AJ348883.
5. Copy the unique key from the second calendar. You can either find this at the top of the page in the calendar information section or by editing the add-to-calendar links for the second calendar.
6. In the link for the first calendar that you are editing, add the unique key for the second calendar alongside the first, separated by a dash ("-"). The final link should look something like this: https://www.addevent.com/calendar/AJ348883-ih348885+google
7. Make sure that you edit and update the link for each of the calendar services that you include. If you don't do that, you risk users with a certain calendar platform only subscribing to the events for a single calendar.
8. Repeat steps 6 and 7 for each additional calendar that you want to add.
9. When a user subscribes to the combined calendar by clicking the Add to Calendar links, then all of the events from all of the calendars added to the link will show up on their calendar.

📘

Embedding multiple calendars into a single events list is not currently supported.