Add to calendar

Add to calendar is a pure javascript user-friendly plugin that allows anyone to easily save important dates and events to any personal calendars on a single button click.

Download now
138 downloads 😍

How to use Add to Calendar

Easily install and use Add to Calendar on your web app.

  1. 1

    Link plugin library to your web page's resources

    <head>
      <!-- Add to calendar library -->
      <script src="add-to-calendar.js"></script>
    </head>
  2. 2

    Initialize the plugin on a page element

    <a id="myButton">Add to calendar</a>

    <!-- init Add to calendar -->
    <script>new atc('#myButton');</script>
You can find more tech details on the official Add to Calendar's documentation.
DocumentationConfigure plugin
You can now easily install Add to Calendar on your Wordpress website too! Learn more

What features does Add to Calendar include

Add to calendar seamlessly integrates with your website, fully customizable!

  • Easy integration with websites and apps

    This Add to Calendar plugin is designed to be easily integrated into any website or app.

  • Multiple calendar support

    This Add to Calendar plugin supports a wide range of popular calendar applications, including Google Calendar, Apple Calendar, Outlook, and more. This means that your users can easily add your event to the calendar application of their choice, ensuring maximum accessibility and convenience.

  • Customizable design

    This Add to Calendar plugin is fully customizable, allowing you to choose the colors, fonts, and styles that best match your brand.

  • Automatic time zone detection

    This Add to Calendar plugin automatically detects the time zone of the user, ensuring that the event is added to their calendar in the correct time zone. This eliminates the need for manual time zone adjustment and ensures that your users will always be on time for your event.

  • Detailed event information

    This Add to Calendar plugin allows you to provide detailed event information, including the event title, location, start and end times, and any additional notes or instructions. This ensures that your users will have all the information they need to successfully attend your event.

What accessibility features does Add to Calendar include

Add to calendar provides an inclusive and user-friendly experience for everyone!

  • Keyboard Navigation

    Navigate through Add to calendar with ease using only your keyboard. Intuitive key bindings allow you to open the Add to calender plugin, move between options, and make selections without needing a mouse or touch input.

  • Managed Focus

    Our Add to calender plugin is designed to manage focus effectively, ensuring a smooth and predictable user experience. As you interact with Add to calendar, focus automatically moves to relevant elements, preventing confusion and creating a clear navigation path.

  • Collision Aware

    Add to calendar intelligently adapts to its environment, ensuring the Add to calender dropdown never appears off-screen or overlaps important content. This feature enhances usability and ensures accessibility by keeping the interface visually accessible at all times.

  • Alignment Control

    Full control over the alignment of the Add to calender plugin ensures it suits any layout. Whether aligned to the top, bottom, or sides, Add to calendar accommodates varying interfaces and maintains its usability across devices.

  • Screen Reader Support

    Designed with assistive technologies in mind, Add to calendar is fully compatible with screen readers. Each element is properly labeled and described, allowing visually impaired users to navigate and interact with the Add to calender plugin effortlessly.

Accessibility features are included only from the javascript version 2.X

Why use Add to Calendar

Add to calendar simplifies scheduling for important events on websites and apps.

This plugin integrates seamlessly with popular calendar platforms such as Google Calendar, Outlook, and Apple Calendar. With a simple click of the button, users can quickly and easily add the event details to their chosen calendar, ensuring they never miss an important date or event.

How to get Add to Calendar

Get Add to Calendar for free now and experience the difference!

New version

Javascript

Version: 2.0.0

  • Full javascript features access
  • Accessibility features
Last release 2025-01-29

138 downloads 😍

See also...

Hi 👋

Sign in now – it’s fast!!

By signing up, you accept our Terms and conditions and confirm to have read our Privacy Policy.

Signup with your email

We've sent a passkey to your email, check your inbox (or in the spam) and copy and paste the passkey code here to confirm your identity!