Date All Day

Extends Drupal core's datetime range fields to provide an 'All day' option, allowing editors to mark events that span the entire day without specifying specific times.

date_all_day
4,766 sites
20
drupal.org

Install

Drupal 11, 10, 9, 8 v2.1.0
composer require 'drupal/date_all_day:^2.1'

Overview

The Date All Day module enhances Drupal's datetime range fields by adding an 'All day' functionality. This is particularly useful for events, schedules, and content types where certain dates represent full-day occurrences rather than specific time slots.

When the 'All day' checkbox is enabled, the module automatically hides the time input fields from the editor and stores the date with times set to midnight (00:00:00) for the start and end of day (23:59:59) for the end. The formatters then detect this pattern and display only the date portion without time information, providing a cleaner presentation for all-day events.

The module provides a widget for data entry and multiple formatters for displaying the dates, all of which are aware of the all-day status and format the output accordingly.

Features

  • Adds an 'All day' checkbox to datetime range field widgets that toggles visibility of time inputs
  • Automatically sets start time to 00:00:00 and end time to 23:59:59 when all-day is checked
  • Provides three field formatters (Default, Custom, Plain) that display date-only format for all-day dates
  • JavaScript behavior that dynamically hides/shows time fields based on checkbox state
  • Configurable date-only format setting for formatters to control how all-day dates are displayed
  • Support for optional end dates in date ranges
  • Helper utility class to programmatically detect if a date range represents an all-day event

Use Cases

Event Calendar with All-Day Events

When building an event content type, you can use this module to allow editors to mark events as 'all day' events (like holidays, conferences, or deadlines) without requiring specific start and end times. The event will display simply as 'December 25, 2024' rather than 'December 25, 2024 00:00 - December 25, 2024 23:59'.

Conference or Workshop Scheduling

For multi-day conferences or workshops, editors can create events that span multiple full days. By checking the 'All day' option, the display will show 'January 15, 2024 - January 17, 2024' without cluttering the output with time information.

Deadline and Due Date Management

When creating content types for project management or academic systems, deadlines often apply to an entire day rather than a specific time. The all-day feature provides a clean way to represent 'Due by end of December 31' without specifying arbitrary times.

Public Holiday or Closure Announcements

Organizations can use this module to announce office closures or public holidays. An 'all day' date range cleanly communicates that the closure applies to the entire day or range of days.

Tips

  • Use the 'date_only_format' setting in the formatter to customize how all-day dates are displayed. You can create a custom date format like 'F j, Y' for more readable output like 'December 25, 2024'.
  • The DateRangeAllDayHelper::isAllDay() utility method can be used in custom code to programmatically check if a date field value represents an all-day event.
  • When theming date output, remember that all-day dates use the 'time' theme with ISO 8601 datetime attributes, which is good for SEO and accessibility.
  • The module stores all-day events with times 00:00:00 to 23:59:59 in the database, which means existing queries and views that filter by time will still work correctly.
  • If using optional end dates, the end date field will be marked as optional in the form, allowing single-day all-day events without requiring an end date.

Technical Details

Troubleshooting 3
Time fields still appear even when 'All day' is checked

Ensure that the JavaScript library is properly loading. Check that the 'date_all_day/date_all_day' library is attached to the form and that there are no JavaScript errors in the browser console.

All-day dates are displaying with times

Make sure you are using one of the 'All day' formatters (Default All day, Custom All day) in the Manage display settings. The standard core formatters will not recognize the all-day pattern and will display times.

The 'date_all_day' date format is not available in the formatter settings

The date format is installed when the module is enabled. Try uninstalling and reinstalling the module, or manually create the date format at Administration > Configuration > Regional and language > Date and time formats.