Calendar Widget

Keyboard and screen reader support for the calendar widget

The embedded calendar widget is built for keyboard and screen reader use when visitors browse events, open details, and start registration on your site.

These behaviors apply to the customer-facing embedded events widget. They do not change widget setup, checkout, or backend registration settings. Turn on Sort and Filter and the Search Bar in the widget builder if you want those controls available; see Set up your calendar widget.

Event chips announce the date

Interactive event chips in the calendar include the full calendar date in their accessible name, along with the event title and time (unless time is hidden).

Screen reader users hear which day an event belongs to as they move from chip to chip, not only the time and title.

Search field

When the search bar is enabled, the search field’s accessible name is Search events, matching the visible Search events… placeholder.

Sort and Filter menus

When Sort and Filter are enabled, visitors can open either control with the keyboard and move through options without focus leaving the open menu.

  • Opening Sort or Filter moves focus into the first option in the menu.

  • Arrow Down and Arrow Up move between options and wrap at the ends of the list.

  • Home moves to the first option; End moves to the last option.

  • Escape closes the menu and returns focus to the Sort or Filter button that opened it.

  • Tabbing out of the menu closes it.

Event details and registration navigation

When a visitor opens an event, the navigation landmark label matches the current step in the overlay.

  • On the event details step, the landmark is labeled Event details navigation.

  • After the visitor continues into registration steps, the same landmark is labeled Registration progress.

That split keeps the details view distinct from the registration flow for assistive technologies.

Was this helpful?