web-dev-qa-db-fra.com

Comment changer de menu en fonction de la langue?

Je souhaite modifier le menu principal en fonction de la langue de l'utilisateur. J'ai examiné des plugins multilingues tels que WPML et qTranslate. Ils ont beaucoup de fonctionnalités mais ce que je veux est beaucoup plus simple que ce qu'ils fournissent.

Il y aura trois liens tels que l'anglais, l'arabe et le turc dans le coin supérieur droit. Lorsque l'utilisateur clique sur l'un d'entre eux, la barre de menus doit changer en conséquence.

2
Mert Nuhoglu

Cela peut être fait via des cookies.
Nous le configurons avec Javascript, rechargeons la page et affichons différents menus dans PHP en utilisant sa valeur.

Commencez par imprimer le script en bas de page (voir les commentaires).
Remarque: il serait préférable de le mettre en file d'attente avec vos scripts de thème.

add_action( 'wp_footer', 'wpse_77220_language_cookie' );   
/**
 * Cookie script based on http://github.com/bainternet/Admin-Page-Class
 */
function wpse_77220_language_cookie()
{
    echo '<script>
    /* Set Cookie */
    function setCookie( name,value,days ) 
    {
        if (days) 
        {
            var date = new Date(); 
            date.setTime(date.getTime()+(days*24*60*60*1000));
            var expires = "; expires="+date.toGMTString();
        }
        else var expires = "";

        document.cookie = name+"="+value+expires+"; path=/";
    } 

    /* Get Cookie - not used in this example */
    function getCookie( name ) 
    {
        var nameEQ = name + "=";

        var ca = document.cookie.split(";");
        for(var i=0;i < ca.length;i++) 
        {
            var c = ca[i]; 
            while (c.charAt(0)==\' \') c = c.substring(1,c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
        }
        return null;
    }

    /* Erase Cookie - not used in this example */
    function eraseCookie(name) { setCookie(name,"",-1); }

    // Bind click on language menu action to show the nav menu.
    jQuery(document).ready(function() 
    { 
        jQuery(".lingo").bind("click", function(event)
        {
            setCookie( "user_lingo", jQuery(this).attr("id") );
        });
    });
</script>
';
}

Si jQuery n'est pas inclus dans votre thème:

add_action( 'wp_enqueue_scripts', 'wpse_77220_enqueue_jquery' );   
function wpse_77220_enqueue_jquery() {
    wp_enqueue_script( 'jquery' );
}

Ensuite, dans le thème header.php, nous mettons ceci:

</head>
<?php 
    if( isset( $_COOKIE['user_lingo'] ) ) {
        $user_lingo = $_COOKIE['user_lingo'];
    } else {
        $user_lingo = 'en';
    }
?>
<body <?php body_class(); ?>>

Ensuite, le wp_nav_menu:

<?php wp_nav_menu( array( 'menu' => $user_lingo ) ); ?>

Dans cet exemple, les menus de navigation ont le même nom que les valeurs que nous allons définir pour le cookie. Si vos menus portent un autre nom, vous devez adapter l'en-tête conditionnel à $user_lingo.
navigation menus

Enfin, le menu des langues. La classe lingo est liée via jQuery pour définir la valeur du cookie avec les ancres id '. La valeur href force le rechargement de la page. Vous pouvez utiliser une autre méthode si vous le souhaitez.

<a href="?lang=pt" id="pt" class="lingo">pt</a> |
<a href="?lang=es" id="es" class="lingo">es</a> |
<a href="?lang=en" id="en" class="lingo">en</a>
2
brasofilo