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 Search bar and Sort and filter in the Features group of the calendar editor 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.
Pressing Escape closes an event's details before it closes the registration popup, except when the visitor opened the event from a product page's Register button: one press then closes the whole popup and returns focus to the Register button. For events opened from the event list or a direct link, the first press closes the event details and the second closes the popup; this two-step behavior applies again after returning to the list or opening a different event. On a phone, Escape on a directly opened event closes the event view without closing the popup. Nested menus, dialogs, and lightboxes can use Escape for their own behavior, but ordinary registration fields do not: once no nested layer owns the key, Escape can close the enclosing event details or popup, and holding the key down does not trigger additional closes.