Name Each Menu Landmark for Screen Readers
Gives every classic menu location its own accessible name (for example "Primary menu" or "Footer menu"), so screen reader users can tell navigation regions apart.
Opens WPIDE on
Code
// Theme location => accessible name for its <nav> container.
$wpide_menu_labels = array(
'primary' => 'Primary menu',
'menu-1' => 'Primary menu',
'footer' => 'Footer menu',
'social' => 'Social links',
);
add_filter( 'wp_nav_menu_args', function ( $args ) use ( $wpide_menu_labels ) {
$location = isset( $args['theme_location'] ) ? $args['theme_location'] : '';
if ( ! $location || empty( $wpide_menu_labels[ $location ] ) ) {
return $args;
}
if ( empty( $args['container'] ) || 'div' === $args['container'] ) {
$args['container'] = 'nav';
}
if ( empty( $args['container_aria_label'] ) ) {
$args['container_aria_label'] = $wpide_menu_labels[ $location ];
}
return $args;
} );Notes
Menu locations without a label in the list keep the theme's default; find your location names under Appearance > Menus > Manage Locations.
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.