CodeWordpress

WordPress : Un fil d’Ariane pour les menus

Source : http://radama.free.fr

Ayant développé un site web wordpress utilisant les “menus” wordpress, je me suis rendu compte qu’il n’existait pas de plugin qui permette d’afficher un fil d’Ariane corrspondant.

ça peut paraître idiot mais ça ne l’est pas tant que ça puisque les menus wordpress, définis à la main, permettent d’utiliser :

  • des catégories
  • des pages
  • des liens externes

Ainsi, on ne peut pas insérer explicitement d’articles, ce qui est logique, vu qu’ils ont vocation à se multiplier.

Si un article appartient à deux catégories, il faudrait qu’on puisse afficher :

Catégorie 1 > sous-catégorie 11
(ou … catégorie 2 > sous-catégorie 21)

par exemple.

C’est l’objet du plugin “fil d’ariane pour menu” que j’ai développé et publié sous wordpress.org.

En détails…

« Fil d’Ariane pour Menu » permet d’afficher un fil d’Ariane correspondant à la navigation en cours sur un site utilisant un « Menu » personnalisé (« menu » au sens WorPress, pouvant contenir liens, catégories, pages).

Ce plugin fonctionne avec un site contenant jusqu’à 3 menus différents (pour un site en trois grandes parties par exemple).

Le principe est de définir une catégorie du même nom que le menu, pour chaque menu. Puis de rattacher les catégories affichées dans un menu à cette catégorie mère.

L’interface du plugin permet de faire le lien explicite entre les menus et les « catégories mères » créées.

Chaque menu doit également être rattaché à une page mère, qui est en quelque sorte, la page portail du menu.

Principe

Le plugin affiche en fait le menu lui-même, en le transformant : en remplaçant les balises ul et li (listes) en span, et en déterminant pour chaque élément s’il est un parent de la page ou de l’article en cours (ajout de la classe « unparent »).

L’affichage ou non se gère ensuite dans votre fichier CSS.

Dépendances

Vous pouvez installer le plugin « yoast_fil_ariane » pour une meilleure couverture de votre site, puisque par défaut, lorsque le plugin ne parvient pas à déterminer le fil d’ariane, il affiche celui de yoast_fil_ariane.

Installation

1. Téléchargez fil_ariane_menu.php vers le répertoire /wp-content/plugins/fil_ariane_menu/

2. Activez l’extension à travers le menu « Extensions » dans WordPress

3. Configurez les correspondances entre menus, catégories et pages dans le menu d’administration du plugin (« Fil d’Ariane Menu » : dans le cadre « Réglages » de la colonne de gauche)

4. Insérez les lignes suivantes dans votre template :

if ( function_exists('fil_ariane_menu') ) {
    fil_ariane_menu($menu_correspondance_config);
}

5. Configurez votre fichier style.css pour afficher uniquement les éléments de classe « unparent » :

.menubreadcrumb span{
    display:none;
}
.menubreadcrumb span.current-menu-ancestor,
.menubreadcrumb span.current-menu-item,
.menubreadcrumb span.current-page-item,
.menubreadcrumb span.current-category-ancestor,
.menubreadcrumb span.current-post-ancestor,
.menubreadcrumb span.current-menu-parent,
.menubreadcrumb span.current-post-parent,
.menubreadcrumb span.current-item{
    display:inline;
    font-weight:bold;
    }
.menubreadcrumb span.current-menu-item a,
.menubreadcrumb span.current-page-item a,
.menubreadcrumb span.current-item a{
    text-decoration: none;
    color:black;
}
 
li.unparent{
    display:list-item!important;
}
li.unparent > a{
    /* color:orange!important; */
}
li.unparent > ul > li{
    display:list-item!important;
}
span.unparent {
    display:inline!important;
}
span.unparent > a{
    /* color:orange!important; */
}
Related Posts with Thumbnails

Un commentaire

Laisser une réponse

Connect with Facebook