web-dev-qa-db-fra.com

Ajouter un attribut personnalisé au lien d'élément de menu à l'aide du filtre

Afin d'accroître l'accessibilité de mon thème, je souhaite ajouter l'attribut aria-current="page" à l'élément de menu qui a la classe .current_page_item.

À partir de maintenant, je le fais via jQuery en utilisant les éléments suivants:

var currentitem = $( '.current_page_item > a' );
currentitem.attr( 'aria-current', 'page' );

Bien que cela fasse ce que je veux, je préférerais que PHP gère cette chose en particulier.

Je sais que je peux le faire avec une classe Nav Walker personnalisée ou avec un filtre pour nav_menu_link_attributes. Malheureusement, je n'ai vu aucun code, même à distance, près de ce que je veux faire.

function my_menu_filter( $atts, $item, $args, $depth ) {
   // Select the li.current_page_item element
   // Add `aria-current="page"` to child a element
}
add_filet( 'nav_menu_link_attributes', 'my_menu_filter', 10, 3 );

Toute aide pour écrire ce filtre serait appréciée.

menusaccessibility
4
Cedon

Vous pouvez cibler la classe CSS current_page_item ou plutôt la classe CSS current-menu-item. current_page_item class peut ne pas être présent pour tous les types d’éléments de menu. Lisez la réponse ici pour savoir pourquoi.

Quelle que soit la classe CSS choisie, vous pouvez utiliser le CODE comme suit pour définir l'attribut:

add_filter( 'nav_menu_link_attributes', 'wpse260933_menu_atts_filter', 10, 3 );
function wpse260933_menu_atts_filter( $atts, $item, $args ) {
    if( in_array( 'current-menu-item', $item->classes ) ) {
        $atts['aria-current'] = 'page';
    }
    return $atts;
}
4
Fayaz

Vous pouvez utiliser le filtre nav_menu_link_attributes pour y parvenir:

function add_attribute_to_current_menu_item( $atts, $item, $args ) {
    // check if this item represents the current post
    if ( $item->object_id  == get_the_ID() ) 
    {
        // add the desired attributes:
        $atts['aria-current'] = 'page';
    }
    return $atts;
}
add_filter( 'nav_menu_link_attributes', 'add_attribute_to_current_menu_item', 10, 3 );

Voir nav_menu_link_attributes pour plus d’informations.

0
Yoav Kadosh