How to embed an event calendar on your website
Display your events with an AddEvent embeddable calendar
AddEvent lets you embed an event calendar on your website or landing page. Visitors can browse events, view details, save individual events to their calendars, or register for events with RSVP enabled. You can also let visitors subscribe to your calendar to receive its events and future updates in their own calendars.
This guide explains how to create and embed your calendar, customize its appearance, and configure subscriptions. For an overview and examples, explore our embeddable calendar solution.
What is the difference between an embedded calendar and a calendar subscription?
An embedded calendar displays events on your website. A calendar subscription connects those events to a visitor's personal or work calendar. You can offer both from the same AddEvent calendar.
Use an embedded calendar to help people discover your schedule. Offer a calendar subscription when you want them to receive future events and changes in their own calendars.
How to create an event calendar in AddEvent
Create a calendar in AddEvent, then add the events you want to display on your website.
- Create a calendar in the AddEvent dashboard or through the AddEvent API.
- Add events in the dashboard, through the API, or through the Zapier integration. You can also import events by synchronizing with an external calendar.
- Check each event's title, date, time, time zone, and other details before sharing your calendar.
How to import events from an external calendar
Synchronize an external calendar with AddEvent when your events already exist in another calendar service. This lets you display and share those events without copying them manually.
You need a calendar feed in valid iCalendar (.ics) format. Configure synchronization for your AddEvent calendar using that feed.
Edit synchronized events in the original calendar service. These events cannot be edited directly in AddEvent; changes made in the source calendar are synchronized to AddEvent.
How to install an embeddable calendar on your website
Copy your calendar's embed code from AddEvent and paste it into the page where you want the calendar to appear.
- Open your calendar in the AddEvent app.
- Copy the embeddable calendar code snippet.
- Paste the code into your website. In a website or landing page builder, use its HTML embed or custom embed option.
- Preview the page on desktop and mobile, and check that events display correctly.
- Test the event details, Add to Calendar options, RSVP flow, and Subscribe button where enabled.
Your website editor must support the required embed code. If you need help installing the calendar, contact support@addevent.com.
What can visitors do in an embedded event calendar?
Visitors can browse your events and select an event to view its details. Depending on the event and the features you enable, they can:
- Open the event's hosted landing page.
- Save a standard event to their personal or work calendar.
- Respond through an online RSVP form when RSVP is enabled.
- Subscribe to the calendar to receive its events and future updates.
- Choose from the available calendar views and select a time zone for viewing events.
Browsing, registering, and subscribing are separate actions. Viewing your embedded calendar does not automatically register someone for an event or subscribe them to your schedule.
How to customize your embedded calendar
Use the standard template or customize the calendar to match your website. Choose Quick customize for display settings, or create a custom template for more control over the design.
Quick customize: adjust display settings
Choose which calendars appear, which features are available, and the default calendar view. You can also adjust time and day formats.
Custom templates: change the design with HTML and CSS
Create a custom template to adjust fonts, colors, language, date and time formats, and other design details. This option requires HTML and CSS knowledge.
Review your customized calendar on different screen sizes before publishing, especially if you change its layout or mobile behavior.
Mobile display, subscriptions, and calendar updates
Review these options to decide how your calendar appears and how visitors receive events.
Does the embedded calendar work on mobile?
Yes. The embeddable calendar switches to a mobile-specific view on smaller screens. A custom template lets you adjust the width at which it switches to that view.
Can I display multiple calendars in one embedded view?
Yes. You can combine multiple AddEvent calendars in one embedded view. For example, keep workshops, webinars, and community events in separate calendars while displaying them together on your website.
Use the customization settings to choose which calendars are included and which are displayed by default. Visitors can adjust the displayed selection using the available calendar controls.
Can visitors subscribe to my embedded calendar?
Yes. The Subscribe option lets visitors connect your calendar to their personal or work calendar. Your events and later changes become available through that subscription.
Learn more about subscription calendars. If you only want to display events on your website, remove the Subscribe button through the customization settings.
Can I collect subscriber names and email addresses?
Yes. You can require visitors to complete a subscriber form before subscribing, or allow subscriptions without entering a name or email address.
Subscriptions without a personal-information form
The anonymous subscription option lets visitors subscribe without filling in personal details. AddEvent still records technical subscription data, including IP address, location, calendar service, and synchronization data. This option does not mean that no data is collected.
Subscriptions with a subscriber form
When you enable subscriber data collection, visitors are directed to the calendar landing page to complete a form before subscribing. The default fields require a name and email address.
You can add text, number, email, date, country, and state fields; radio buttons and checkboxes; marketing consent checkboxes; and query-string fields. Choose the information you need to manage your calendar audience.
Can I anonymize subscriber IP address data?
AddEvent automatically anonymizes IP addresses for users in the European Economic Area (EEA). You can also choose to anonymize this data for all users. This does not remove names, email addresses, or other details submitted through a subscriber form.
How quickly do changes appear in subscribers' calendars?
Calendar subscription updates are not instant. Each subscriber's calendar service decides how often it checks the AddEvent calendar for changes.
Updates to event details, dates, and times, along with added or deleted events, are reflected when the service refreshes the subscription. Timing varies by service and its settings.
If an event changes shortly before it starts, notify attendees directly rather than relying only on the calendar subscription to refresh in time.
Can subscribed events include calendar reminders?
You can configure one calendar notification per event and choose how long before the event it should occur. Delivery is controlled by the subscriber's calendar service and settings, so AddEvent cannot guarantee that the reminder will appear.
Some calendar services disable notifications for subscribed calendars. Subscribers may need to enable them in their calendar settings where that option is available.
How are time zones displayed in the embedded calendar?
AddEvent uses a visitor's IP-based location estimate to choose the initial time zone for the embedded calendar. Visitors can use the time zone selector to view events in another time zone if the estimate is incorrect or they prefer a different one.
When visitors subscribe, their own calendar service displays the events according to its time zone settings. Set the correct time zone for each source event.
Does AddEvent support daylight saving time?
Yes. AddEvent supports daylight saving time rules when handling event times. Use the event's intended time zone so the schedule can be displayed correctly across time zones and seasonal clock changes.
Add an event calendar to your website
Get started with AddEvent, create your calendar, and copy the embed code to your website. Need help with installation or customization? Contact support@addevent.com.