What’s an Embeddable Calendar? how-to

Embeddable calendars are a fantastic tool for engaging your customers, increasing attendance at your events, and providing a simple and beautiful overview of your upcoming events directly on your website. Our calendars are packed full of calendar features and allow you to manage and share all your events with your users with ease.

Embedding a calendar on your website allows you to create a public calendar where customers or clients can see your calendar widget. Since our embeddable calendar widget creates an interactive calendar, viewers can change the calendar settings to display in month view, week view, or list view. 

Better yet, they can even subscribe to your calendar to get all of your upcoming events added to their personal calendar. AddEvent supports many calendar apps, including Google Calendar, Outlook Calendar, Apple Calendar, Office 365, and Yahoo Calendar.

Examples of How to Use a Website Calendar:

• Embed a course calendar on your coaching and course website
• Let your customers know when your next promotional events are happening
• Share your event calendar of marketing events, such as upcoming tutorials, webinars, and special customer events

See Embeddable Calendars In Action

AddEvent’s embeddable calendars integrate quickly and seamlessly with your website. If you use any of the main website builders, we’ve got you covered – our embeddable calendar works perfectly across most builders and web pages. We even have plugins available for WordPress, Wix, and Webflow!

Adding an embeddable calendar to your website is as simple as creating the calendar, adding your upcoming events in AddEvent, customizing it to suit your needs, and then copying and pasting the embed code (most common and works with most html code editors) into your website.

This article will show you how to create, customize, and embed your calendar in just a few super-easy steps!

How to embed a calendar on your website

First, sign up or log in to your AddEvent account

Choose from our free Hobby plan or one of our paid plans, which come with lots of additional features. Learn more about our plans on our plans and pricing page.

Create your event in AddEvent

From your dashboard, click the Create button and choose Event. On the Event Detail page, you can set the date, time, and event information, and turn on RSVPs if needed.
When you’re ready, hit the Create event button to publish your event landing page.

We’ve got tons of fantastic calendar features for each event, such as event series, time zone selector, recurring event rules, and RSVP functionality. 

You can also share these events individually using all of our great tools, like our Add to Calendar button for websites and landing pages, Add to Calendar links for emails, our event landing pages, and embedding an embeddable event tile.

→ AddEvent Pro Tip: If you already have these events in an external calendar service, you can import events into your calendar from Google Calendars or any main calendar app in an iCalendar (.ics) format.

Now that you have your events in your calendar, it’s time to embed it on your website!

You can also add or update events in the future, and they will automatically show up on your embedded calendar. That’s the beauty of using a dynamic embeddable calendar for your website calendar instead of just an image!

Customize your embeddable calendar

On the Calendar Detail Page, scroll down to the Share your event section.

You will see two options – Embeddable Calendar and Embeddable Events List. This gives you two different ways to set and customize your calendar format before you embed it on to your website or landing page.

Differences Between an Embeddable Calendar and an Embeddable Events List

An embeddable calendar is going to give you a full month, week, or schedule view of your upcoming events embedded on your website. This is the traditional calendar interface you would expect to see from a calendar plugin for your web calendar. It’s up to you to decide how you want your calendar format to look!

An embeddable events list will give you a list of events so users can easily scroll through your upcoming events without the traditional calendar view.

For the sake of this example, we will walk through the steps to embed the full calendar. The steps are the same, so if you’re embedding the embeddable events list, don’t fear — you can still follow along!

When you’re ready to customize your embeddable calendar, head to the Design tab in the dashboard. (For quick customization options, you can use the Customize and Share button.) 

Click the + Create design to start a new embeddable calendar template. This is where you’ll be able to customize the calendar features, default options, color, and more. These allow you to match our embeddable calendar to your website branding seamlessly.

When your embeddable calendar looks exactly how you want it to, simply click the Create design button to save. Now, head to the calendar you want to apply this template to back on the Dashboard. 

4. Apply the template to your embeddable calendar

Head to the Calendar Details page and scroll down to the Embeddable calendar section. In the Template: section, scroll down to your new design template and select it. 

5. Copy & Paste the Embed Code Into Your Website Builder of Choice

Once you’ve applied the right design template, click Customize and Share in the bottom righthand corner. Then, select Show embed options in the top right corner. 

Paste the code for your embeddable calendar directly into your website or your website builder. It’s as simple as that!

AddEvent Pro Tip: If you are using a website builder, you should typically look for a code snippet or custom HTML section to put the embed code, URL, or iFrame.

Embeddable Calendars and Calendar Subscriptions Combined

One of the most powerful pieces of calendar functionality offered by our embeddable calendars is that AddEvent’s embeddable calendar and AddEvent’s subscription calendar are the same thing!

You can let your end-user subscribe to your calendar directly from the calendar embedded on your website, or you can use any of our other calendar sharing methods!

Subscription Calendars

If a user subscribes to your embeddable calendars, a dynamic link between the calendar in AddEvent and their calendar service is created.

If you don’t know what that means, don’t worry, we will try again! We know it’s a bit of a foreign concept, so let’s dive in!

If you add new events or update your event details, these changes will be shown in your user’s calendars. You can allow users to subscribe to your calendar anonymously or collect completely customizable fields on each of your users before they can subscribe.

If you don’t want users to subscribe to your calendar, no problem! You can remove that option when you customize your embeddable calendar.

Calendar Sharing Methods:

• Add to Calendar button for your website
• Add to Calendar Links for Emails and Social Media
• Calendar Landing Page
  • Created automatically and perfect for sharing on social media
• Direct Links to the following Calendar Services:
  • Apple Calendar
  • Google Calendar
  • Office 365
  • Outlook
  • Outlook.com
  • Yahoo Calendar

Simple but powerful customization

At AddEvent, we believe that you shouldn’t have to compromise when it comes to how your web calendar widget looks on your website. We give you two powerful customization options to customize your embeddable calendar: quick customize and custom calendar templates.

Custom Calendar Design Templates

With AddEvent 2.0, you can create fully customized calendar pages without writing a single line of code. Our no-code design templates make it easy to adjust every aspect of your embeddable calendar, so it perfectly matches your website’s look and feel. 

Previously, customizing your calendar required JavaScript knowledge—but now, powerful design options are accessible to everyone, letting you create a calendar that’s truly yours.

Embeddable events

You can also use the same technique to embed a single calendar event on your website instead of using an entire web calendar. Like our embeddable calendar, our embeddable events are completely customizable and will integrate seamlessly with your custom site or any website builder, such as Wix, Squarespace, WordPress, Weebly, Leadpages, or Jimbo.

Using AddEvent’s Embeddable Calendars

When it comes to creating a beautiful embeddable calendar, AddEvent is here to help. Get started for free by creating your calendar and events today!

Note: If you would like to use AddEvent’s embeddable calendar, you will need to be on a paid plan. Reach out to trial@addevent.com to request a free trial to try it for yourself!

FAQs