A demo site for Drupal calendars.

Web calendars

Google calendar and Outlook have calendars for scheduling meetings and planning your day.

Meetup and Eventbrite have a calendar of events that you can sign up or buy tickets for.

Calendly lets people book meetings with you.

Calendar libraries

Fullcalendar is a javascript library that can display a configurable calendar.

QCalendar is a library for the quasar (vue) framework.
Demo: https://codepen.io/Hawkeye64/pen/dyvpYwW

React Calendar is a robust React library.

Drupal modules

Calendars

Calendar

https://www.drupal.org/project/calendar/

Calendar views rendered using twig templates.

Provides views templates to quickly create a view with year, month, week, and day displays.

Rendered as a table - not good for mobile, needs custom css.

Link to day/week/month/year using contextual filters.

Works with Recurring Date Fields (or does it?), but not Smart Date.

Demo

Issues

Using pager breaks tab navigation:
https://www.drupal.org/project/calendar/issues/2867991

Color by taxonomy not working:
https://www.drupal.org/project/calendar/issues/3200762

Date range field not working:
https://www.drupal.org/project/calendar/issues/3240209

Unable to set date contextual filter via layout builder block config
https://www.drupal.org/project/drupal/issues/2886116
https://www.drupal.org/project/drupal/issues/2847644

Doesn't support Smart Date.
https://www.drupal.org/project/calendar/issues/3177761

Multiday - End date is not considered for contextual filter
https://www.drupal.org/project/calendar/issues/3358750

Events starting in a month and ending in another one are not shown in the ending month
https://www.drupal.org/project/calendar/issues/3473234

Steps towards handling end dates in Calendar 8
https://www.drupal.org/project/calendar/issues/2699477

Doesn't support recurring dates field.
https://www.drupal.org/project/calendar/issues/2820803

Calendar View

https://www.drupal.org/project/calendar_view/

A newer calendar view display with month/week.

Use empty class to hide empty days on mobile.

No contextual filter - uses calendar_timestamp query parameter.

Issues

• Default date doesn't work
  • Configure display to use date from first result doesn't work.
• Drag & drop functionality

Demo

Demo: https://www.drucal.org/

Documentation

Fullcalendar View

https://www.drupal.org/project/fullcalendar_view/

Uses fullcalendar library as views display.

Supports Fullcalendar JS 4.4.2.

Drag and drop to update dates.

Double click to create events.

Supports recurring events with RRULE value.

Configure colors per taxonomy.

Double click to create event.

Drag and drop to move events.

Hard to customize beyond what's provided via UI.

Demo

Issues

• All day events
• Premium version (Proposal to release a premium version that supports Fullcalendar 6)
• Date Recur 3.x and Fullcalendar 5.x

Fullcalendar Block

https://www.drupal.org/project/fullcalendar_block

Render fullcalendar using json from an api - you can use views data export.

Supports Fullcalendar JS 5.

Less configuration options, but more customization in code.

Documentation

Fullcalendar

https://www.drupal.org/project/fullcalendar

Another Fullcalendar view display.

Supports Fullcalendar JS 6.

Double click to create event.

Drag and drop to move events.

No jQuery dependency.

Demo

Issues

• Single date field shows as long event (Non date range support)
• SQLSTATE[42S22]: Column not found: 1054 Unknown column error when using Ajax and Storage Entities (Actually just AJAX error?)
• FullCalendar Event Hover with title, body, event date and URL
• Double scrollbar / unintuitive ratio setting
• Calendar does not properly allow/disable event editing/dragging
• Fullcalendar is incompatible with Date Recur 3.x

Event Calendar View

https://www.drupal.org/project/event_calendar_view

New module.

Dates

Recurring event content can be built with Smart Date and Recurring Dates Field modules.

Smart Date Module

https://www.drupal.org/project/smart_date

• All day events
• Zero duration (no end time)
• Smart Date Recur submodule for recurring dates.

Recurring Dates Field Module

https://www.drupal.org/project/date_recur

Core modules

Datetime

Field type supports date and date w/ time.

https://www.drupal.org/docs/8/core/modules/datetime/datetime-overview

Datetime Range

Date range field type.

https://www.drupal.org/docs/8/core/modules/datetime-range

Events

Recurring Events module generates event entities for more robust use like comments per event instance.

Entity Registration module can be used for event registration.

Booking and Availability Management Tools for Drupal module.

Recurring Events Module

Recurring Events module does not use RRULE.

Custom recurring date fields on the event series that it uses to generate event instance entities.

Because it doesn't provide an rrule, it can't work with the fullcalendar recurring events feature. That may cause a slow or broken view if there are too many items.

No easy way to bulk extend event instance end date without editing each series.

Integrations

Google Calendar Import module provides a way to import entities from a google calendar.

Google Calendar Service can syncronize google calendar events.

Testing

• Date field types
  • Timestamp
  • Datetime, date only
  • Datetime, date and time
  • Datetime Range, date only
  • Datetime Range, date and time
  • Datetime Range, all day
  • Smart Date Range
  • Smart Date Range, unlimited/recurring
  • Recurring Dates field
• Views date filters
  • Date range
  • Dates between
• Calendars
  • Create event
  • Move event
  • View event info
  • Recurring dates
  • Multiple dates