Archived topic
My Menu's Accessibility is not like the GeneratePress.com Site's menu
6 replies · Started by Michael on May 4, 2022
I purchased GeneratePress (Premium) specifically because of how the generatepress.com website's menu works in regards to accessibility and keyboard navigation.
For example:
1. tabbing through top level menu items, without opening submenus automatically
2. opening a submenu with the enter key
3. using the escape key to exit a submenu
Basically, how the menu works on generatepress.com is how I need mine to work.
However, when I create a menu on my development site (with parents and children), it doesn't work the same way... which I must have.
Am I doing something wrong? I'm brand-new to GeneratePress so perhaps there are settings I'm not aware of?
Please advise.
Sorry. I discovered what I needed to do... AFTER I submitted my ticket.
Marking this as Resolved.
Glad you figured it out! Feel free to reach out anytime you’ll need assistance with anything else. :)
Thanks Fernando
I guess my only question would be... is it possible that when using a mouse on the menu, to have the dropdown menu items display on mouse hover, but if using the keyboard to navigate via the tab key, to have the dropdown menu display by clicking the enter key?
Basically... if you go to the generatepress.com main site, have it work exactly like it does, however when you mouse hover over "Help", to have the dropdown display.
I hope I make sense.
The Navigation Dropdown of the generatepress.com site is set to Click - Menu Item. This setting can be found in Appearance > Customize > Layout > Primary Navigation.
With regards to the Menu item holding the sub menus, these are Custom Links with a URL set to #.
See: https://share.getcloudapp.com/5zuL6yJB
Lastly, with regards to the tabbing and the Enter key, whatever you set in the Navigation Dropdown setting would apply similarly by default.
Hope this clarifies. :)
Hi Fernando
I have set my menu to 'Click - Menu Item' which works great. However, what I was hoping was that when navigation with a mouse, the dropdowns would appear on mouse hover, and not click.
Basically:
1. when tabbing the menu using the keyboard, to open the dropdown by the enter key (which it does).
2. but, when using a mouse, have the dropdowns display on hover.
example:
https://www.splashmg.ca/
You’ll most likely need custom code to achieve as such.
Looking at the reference site you linked, forcing a menu item on hover state isn’t showing the sub-menus, denoting that it has a different logic for its menu system.
See: https://share.getcloudapp.com/Bluo8BGP
Hope this clarifies. :)
