Keyboard Shortcuts
Overview
Keyboard accessibility has been implemented for the following areas:
- search
- megamenu
Search keyboard support
Ctrl + Shift + F: opens the search flyout
Escape: closes the search flyout
Tab / Shift+Tab: moves the focus between interactive items (search box, search icon, search navigation, search settings)
Enter: triggers the configured action (same as clicking on the item)
Edit page shortcut
- Alt + P: opens the page editor
Megamenu keyboard support
Alt + M: opens the megamenu (the first navigation node with children is focused)
Escape: closes the megamenu
S : switches the focus to the search box (user can now use the search functionality while using the keyboard) (Important: Megamenu needs to be open in order to perform this operation)
Tab / Shift+Tab: moves the focus between megamenu items (navigation root nodes, pages nodes, links nodes)
Enter: triggers the configured action (same as clicking on the item)
Megamenu root nodes keyboard support
Right arrow: moves focus to the next item and shows the flyout content if the item has submenu; if focus is on the last item, moves focus to the first item.
Left arrow: moves focus to the previous item and shows the flyout content if the item has submenu; if focus is on the first item, moves focus to the last item.
Down arrow: moves focus to the first item of the submenu (page or link)
Megamenu pages nodes keyboard support
Down arrow: moves focus to the next item and shows children if exist; if focus is on the last item, moves focus to the first item
Up arrow: moves focus to the previous item and shows children if exist; if focus is on the first item, moves focus to the last item
Right arrow: if focus is on an item with children, moves focus on the first child
Escape: closes the mega menu and moves focus to the root parent item
Megamenu links nodes keyboard support
Down arrow: moves focus to the next item of the group; if focus is on the last item, moves focus to the first item
Up arrow: moves focus to the previous item of the group; if focus is on the first item, moves focus to the last item
Right arrow: moves focus to the first item of the next group; if the focus is on an item from the last group, moves focus to the first item of the first group.
Left arrow: moves focus to the first item of the previous group; if the the focus is on an item from the first group, moves focus to the first item of the last group.
Escape: closes the mega menu and moves focus to the root parent item
Megamenu items in edit mode - additional keyboard support
Enter: triggers the save operation
Delete: triggers the delete operation
Megamenu search input - keyboard support
Enter or Up Arrow: moves focus to the first highlighted/ found item
Escape: closes the mega menu and moves focus to the root parent item
Megamenu highlighted items - keyboard navigation
Down arrow: moves focus to the next highlighted item of the group; if the focus is on the last highlighted item, moves focus to the first highlighted item
Up arrow: moves focus to the previous highlighted item of the group; if the focus is on the first highlighted item, moves focus to the last highlighted item
Right arrow: moves focus to the next highlighted item of the same group; if the focus is on the last highlighted item then moves focus to next highlighted item from another group; if the focus is on a highlighted item from the last group, moves focus to the first highlighted item that exists.
Left arrow: moves focus to the previous highlighted item of the same group; if the focus is on the first highlighted item then moves focus to the last highlighted item from a previous group; if the focus is on the first highlighted item that exists, moves focus to the last highlighted item of the last group that contains highlighted items.