web-dev-qa-db-fra.com

Masquer l'élément de menu dans certaines conditions

J'utilise le plugin qTranslate et je dois masquer un élément de menu lorsque la langue n'est pas l'italien.

En recherchant en ligne, j'ai créé cette solution et appliqué la solution dans ce message

J'ai créé le fichier hide-menu.js et le contenu est

 jQuery('a[href*="/it/noleggio-lungo-termine"]').each(function() {
   $("li#menu-item-9452").hide();
});

Puis j'ai ajouté dans le bas de la function.php ce code

   function add_my_script() {
    wp_enqueue_script(
        'hide-menu', // name your script so that you can attach other scripts and de-register, etc.
        get_template_directory_uri() . '/js/hide-menu.js', // this is the location of your script file
        array('jquery') // this array lists the scripts upon which your script depends
    );
   }

mais cette solution ne fonctionne pas.

Comment puis-je résoudre ce problème?

menusjquery
1
Mma87

Dans votre code actuel, la fonction pour ajouter le script n'est jamais exécutée. Vous pouvez placer la fonction add_my_script() où vous voulez, mais vous devez l’attacher à un événement Wordpress. Le meilleur événement pour ce cas est le wp_enqueue_scripts :

add_action('wp_enqueue_scripts', 'add_my_script');
function add_my_script() {
    wp_enqueue_script(
        'hide-menu', // name your script so that you can attach other scripts and de-register, etc.
         get_template_directory_uri() . '/js/hide-menu.js', // this is the location of your script file
         array('jquery') // this array lists the scripts upon which your script depends
    );
}

Votre code javascript est également faux. Selon les sélecteurs jQuery , vous essayez de sélectionner tous les éléments <a> avec un attribut href contenant la sous-chaîne /it/noleggio-lungo-termine, mais de tels éléments n'existent pas dans votre code HTML lorsque la langue n'est pas l'italien. Le code suivant fonctionne simplement pour masquer l'élément li avec id=menu-item-9452:

jQuery("li#menu-item-9452").hide();

Lisez la documentation sur les sélecteurs jQuery et utilisez un sélecteur valide.

Pour masquer cet élément pour certaines langues, vous devez avoir accès à la langue actuelle. Je vois que vous utilisez qTranslate. Une solution possible:

add_action('wp_enqueue_scripts', 'add_my_script');
function add_my_script() {

    wp_enqueue_script(
        'hide-menu', // name your script so that you can attach other scripts and de-register, etc.
         get_template_directory_uri() . '/js/hide-menu.js', // this is the location of your script file
         array('jquery') // this array lists the scripts upon which your script depends
    );

    $scriptData = array(
         'lang' => qtrans_getLanguage(),
    );
    wp_localize_script('hide-menu','script_data', $scriptData);
}

Ant puis dans hide-menu.js:

if( script_data.lang != 'it' ) {
    jQuery("li#menu-item-9452").hide();
}

Aussi, vous pouvez masquer cet élément par CSS. Par exemple, dans le header.php de votre thème, vous pouvez placer ce code entre <head> et </head>:

<?php

 if( qtrans_getLanguage() != 'it' ) {

      echo "<style>#menu-item-9452 { display: none; } </style>";

  }

?>
2
cybmeta