web-dev-qa-db-fra.com

Wordpress cache un menu avec l'API transitoire

Je veux tout simplement mettre en cache un menu de page, qui nécessite environ 50 requêtes lors du chargement de page.

Pour le moment, j'ai le code de configuration du cache avec Transient API

$housemenu = get_transient('housemenu_key');
    if (!$housemenu) {
        $housemenu = wp_nav_menu(
            array(
                'menu' => '',
                'menu_class' => 'sf-menu',
                'menu_id' => 'nav',
                'walker' => new description_walker()
            )
        );
        echo 'not-set';
        set_transient(
            'housemenu_key',
            $housemenu,
            60*60*3
        );
    }
echo $housemenu;

$housemenu = get_transient('housemenu_key'); renvoie un rien. Si je mets comme ça:

$housemenu = 'return corrent';
echo 'not-set';

Tout fonctionne parfaitement. Pourquoi ce menu ne fonctionne pas? Le menu peut être un passager transitoire?

Utilisation: Wordpress 3.8

menuscache
1
Foxsk8

wp_nav_menu() ne renvoie rien par défaut, il renvoie simplement le code HTML formaté.

Pour que wp_nav_menu() renvoie une valeur, vous devrez passer 'echo' => false dans ses arguments, comme suit:

$housemenu = wp_nav_menu( array(
    'menu' => '',
    'menu_class' => 'sf-menu',
    'menu_id' => 'nav',
    'walker' => new description_walker(),
    'echo' => 'false'
));

Il convient de noter qu’en mettant en cache tout le menu dans un transitoire, vous perdrez sa nature dynamique. Par exemple, si vous l'avez mis en cache sur votre page d'accueil, toutes les classes actives appliquées aux éléments de menu seront TOUJOURS refléteront la page d'accueil. Ainsi, si vous visitiez une page différente, les classes actives des éléments de menu seraient fausses.

Cela vous causera beaucoup de peine si vous souhaitez indiquer via CSS la page sur laquelle se trouve l'utilisateur actuel.

3
MichaelJames

un problème existe là-bas ... Wordpress a une détection de page intégrée, pour donner les classes CSS à la page actuelle dans le menu ... et si mis en cache, vos éléments de menu de navigation n'obtiendront jamais la classe "current-page", etc. .

cependant, il existe 2 solutions:

Solution 1

Avant la mise en cache, ajoutez une fois les classes aux éléments <a>:

function add_menu_atts( $atts, $item, $args ) { 
   $atts['class'] = $item->type.'-'.$item->ID;      return $atts;  
}
add_filter( 'nav_menu_link_attributes', 'add_menu_atts', 8, 3 );

puis cache le menu ... il aura cette sortie:

<ul class="..." id="...">
<li class="........"><a class="post_type-312" href="......">Post titleee (it's id is 312)</a></li>
<li class="........"><a class="taxonomy-42" href="....">Category titleee (it's id is 42)</a></li>
</ul>

attachez donc la classe "current-item" de javascript (dans le corps de la page, vous devez passer variable à javascript, pour savoir si vous êtes sur un article, une page, une catégorie ou autre, etc.) ... i.e .:

<script>
var CurrentPageType="post_type";  //or "taxonomy"(for categories); or author or etc...
var CurrentItemId=612;
var element = document.getElementsByClassName(CurrentPageType +'-'+ CurrentItemId)[0]; element.className +=" current-menu-item";
</script>

solution 2

pour les sites typiques, non-wp. J'ai essayé de coder un script JS, ce qui pourrait résoudre le problème. Donc, si vous cachez le menu et que vous voulez obtenir la classe "current-menu-item", mettez cette fonction dans votre source/cache de page (meilleur être au bout du corps):

<script> Highlight_Current_Menu_link("current_item__from_JS", "parent_div_id" ); </script> 
or
<script> Highlight_Current_Menu_link("current_item__from_JS"); </script>

tout d'abord, ajoutez ce code dans l'en-tête (mieux dans le fichier .js):

<script>
function Highlight_Current_Menu_link(Added_class_name, Ancestor_to_search_in, link_to_find){
    var Added_class_name = Added_class_name || "current_item__from_JS";  
    var link_to_find = link_to_find || window.location.pathname;
    var Ancestor_to_search_in = typeof Ancestor_to_search_in === "undefined" ? document.body : getElementById(Ancestor_to_search_in);
    var A_elements = Ancestor_to_search_in.getElementsByTagName("a");
    for(var i=0; i<A_elements.length; i++){
        var condition=false;
        var href=A_elements[i].href.replace(window.location.Origin,""); 
        if(href.indexOf('#')>-1 && href==link_to_find)  {condition=true;}
        else if( RemoveHashString(link_to_find).indexOf(RemoveHashString(href)) >- 1 && 
            href.substring(0, href.lastIndexOf("/")).trim() == link_to_find.substring(0, link_to_find.lastIndexOf("/")).trim()
            ) {
             condition= true;
        }
        if (condition) { A_elements[i].className += " "+Added_class_name; }
    }
}
        function RemoveHashString(str){  var hash=str.split("#")[1];  return str.replace("#"+hash,'');  }
</script>

et déterminez votre style souhaité pour la classe attachée

<style>
.current_item__from_JS{background:red;}
</style>
1
T.Todua

Par défaut, wp_nav_menu() fait écho au résultat et ne renvoie rien. Vous devez définir 'echo' => false dans ses arguments pour inverser le comportement et pouvoir affecter le résultat à une variable.

1
Rarst