- This topic has 6 replies, 2 voices, and was last updated 1 year ago by
Tom.
-
AuthorPosts
-
March 26, 2020 at 10:19 am #1211018
Danny
I use a hamburger menu on both desktop and mobile. How do I add the below to hamburger menu:
aria-label=”Open the menu”
March 26, 2020 at 6:10 pm #1211364Tom
Lead DeveloperLead DeveloperHi there,
For the desktop one, you can do this:
add_filter( 'generate_off_canvas_toggle_output', function() { if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) { return; } $settings = wp_parse_args( get_option( 'generate_menu_plus_settings', array() ), generate_menu_plus_get_defaults() ); $svg_icon = ''; if ( function_exists( 'generate_get_svg_icon' ) ) { $svg_icon = generate_get_svg_icon( 'pro-menu-bars' ); } return sprintf( '<li class="slideout-toggle menu-item-align-right %2$s"><a aria-label="Open the menu" href="#">%1$s%3$s</a></li>', $svg_icon, $svg_icon ? 'has-svg-icon' : '', '' !== $settings['off_canvas_desktop_toggle_label'] ? '<span class="off-canvas-toggle-label">' . wp_kses_post( $settings['off_canvas_desktop_toggle_label'] ) . '</span>' : '' ); } );
The mobile toggle doesn’t have a filter at the moment, unfortunately. However, it does have a
screen-reader-text
element so screen readers can identify it.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentMarch 27, 2020 at 10:44 am #1212255Danny
Thannk you, Tom. I am getting an empty link error on WAVE. Any ideas on how to fix that?
What To Do
Remove the empty link or provide text within the link that describes the functionality and/or target of that link.March 27, 2020 at 2:33 pm #1212443Danny
Also, where should I add the code in elements?
March 27, 2020 at 5:27 pm #1212526Tom
Lead DeveloperLead DeveloperIf you can’t have an empty link, add an off canvas panel label in Customize > Layout > Off Canvas Panel.
That code should be added using one of these methods: https://docs.generatepress.com/article/adding-php/
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentMarch 27, 2020 at 6:07 pm #1212544Danny
Thank you
March 28, 2020 at 11:30 am #1213298Tom
Lead DeveloperLead DeveloperNo problem 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development -
AuthorPosts
- You must be logged in to reply to this topic.