Ajouter des éléments statiques à un menu de navigation WordPress existant (exemple avec Polylang)

Supposons tu aies un site Web multilingue avec le plugin Polylang activé et que tu souhaites afficher des drapeaux de langue à la fin du menu de navigation principal.

Concrètement voici comment ajouter des <li> dans le menu <ul> déja créé par WordPress grâce à ton choix de menu fait dans l'administration "Apparence > Menus".

Cette démarche est valable pour Polylang mais pas que. Si tu souhaites simplement rajouter par exemple un élément à ton menu pour afficher le bouton de mode nuit (comme sur mon site), la démarche est similaire !

Tout ce que tu as à faire est d'appeler une fonction dans wp_nav_menu()

🚀 Voici le tuto pratique en 2 étapes :

1/ Ouvre header.php et modifie le array de wp_nav_menu comme suivant :

<nav id="site-navigation" class="main-navigation" role="navigation">
<?php 
  wp_nav_menu( array( 
    'theme_location' => 'primary',
    'menu_class' => 'nav-menu',
    'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
  ) ); ?>
</nav>

Ici le point important est l'ajout de 'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',

2/ Ouvre le fichier functions.php et ajoute le code de la fonction comme suivant :

Ce code va afficher les langues de Polylang en fin de menu.

//POLYLANG ajout manuel des langues en fin de menu WP

add_filter( 'wp_nav_menu_items', 'ajout_langues', 10, 2 );

function ajout_langues_menu( $items, $args ) {
    // S'applique uniquement au menu principal "primary"
    if ( $args->theme_location === 'primary' ) {
        if ( function_exists( 'pll_the_languages' ) ) {
            $langs = pll_the_languages( array(
                'show_names' => 1,
                'display_names_as' => 'slug',
                'hide_current' => 1,
                'raw' => 1
            ) );

            foreach ( $langs as $lang ) {
                $items .= "<li class='lang-item-mobile d-flex d-lg-none'><a href='" . esc_url($lang['url']) . "'>" . esc_html($lang['slug']) . "</a></li>";
            }
        }
    }

    return $items;
}

Plus de détails sur la configuration de Polylang

En suivant la doc technique de Polylang tu peux choisir d'afficher les langues sous forme de drapeaux, de liste déroulante ou simplement de texte par exemple. N'hésites pas à y jeter un oeil en complément de cet article pour justement l'appliquer à ta sauce sur ton projet 😉🌎

Article édité et actualisé le 06/05/2025