Afficher une sidebar en fonction de la catégorie de l’article consulté

Publié par Fred Le

Catégorie(s): Tutoriel Wordpress
 

Dans ce tutoriel nous allons voir comment afficher une sidebar en fonction de la catégorie de l’article consulté, pour réaliser ce tutoriel je vais me référé au codex de wordpress et utiliser les marqueurs conditionnel is_category  et  is_single pour définir la catégorie de l’article consulté et afficher la sidebar appropriée.

 

 

Première chose à faire déclarer la sidebar pour la catégorie, ouvrez votre fichier function.php de votre thème, ensuite ajouter le code ci-dessous qui va permettre d’ajouter la sidebar de la catégorie dans  le menu Widget de WordPress .Bien sûr vous pouvez dupliquer le code si vous avez plusieurs catégories d’articles avec des sidebars il vous suffit de changer le nom de la sidebar à la ligne :

 

‘name’ => __( ‘Categorie exemple’)

Eviter les accents

register_sidebar(array(

    'name' => __( 'Categorie exemple'),

    'before_widget' => '<div id="%1$s" class="%2$s widget">',

    'after_widget' => '</div>',

    'before_title' => '<h3 class="widget-title">',

    'after_title' => '</h3>', ));

 

Après avoir déclaré votre sidebar faite un copier coller du fichier sidebar.php qui se trouve dans le dossier de votre thème ensuite renommer le de cette manière :

 

Sidebar-idenfiant.php

 

Identifiant est l ID de votre catégorie que vous récupérez dans le tableau de bord de WordPress Articles —> Catégories et dans la colonne Identifiant.

 

Ensuite ouvrez votre fichier sidebar-identifiant.php puis ajouter le nom de votre sidebar dans mon cas sidebar-categorie-exemple.php :

 

<?php

/**

 * Sidebar catégorie exemple.

 */

?>

<div id="sidebar">

<ul>

<?php if ( ! dynamic_sidebar( 'Categorie exemple' ) ) : ?>

<?php endif;?>

</ul>

</div>

 

Dernière étape ouvrez votre fichier single.php de votre thème repérer le code suivant :

 

 get_sidebar();

 

Puis remplacer le par celui-ci :

<?php// si l'article fait parti de la la catégorie exemple

if (is_single() && in_category('categorie-exemple') ) { 

// on affiche la sidebar pour cette catégorie

    get_sidebar('categorie-exemple');

// et si il y a aucune sidebar pour la catégorie de cet article 

} else { 

// on affiche celle par défaut

    get_sidebar(); 

}

?>

 

Remplacer categorie-exemple par l’identifiant de votre catégorie qui est le même que celui du fichier sidebar-categorie-exemple.php.

 

Si vous voulez déclarer plusieurs sidebars pour vos catégories,  créez vos fichiers sidebar avec les identifiants  et écrivez le code comme ceci :

<?php

// si l'article fait parti de la la catégorie exemple

if (is_single() && in_category('categorie-exemple') ) {

// on affiche la sidebar pour cette catégorie

    get_sidebar('categorie-exemple');

	//  

} elseif (is_single() && in_category('categorie-exemple-2') ) {

    get_sidebar('categorie-exemple-2');

	//

} elseif (is_single() && in_category('categorie-exemple-3') ) {

    get_sidebar('categorie-exemple-3');

	//

} elseif (is_single() && in_category('categorie-exemple-4') ) {

    get_sidebar('categorie-exemple-4');

	//

} elseif (is_single() && in_category('categorie-exemple-5') ) {

    get_sidebar('categorie-exemple-5');

	//

} elseif (is_single() && in_category('categorie-exemple-6') ) {

    get_sidebar('categorie-exemple-6');

	//

} elseif (is_single() && in_category('categorie-exemple-7') ) {

    get_sidebar('categorie-exemple-7');

	//

} elseif (is_single() && in_category('categorie-exemple-8') ) {

    get_sidebar('categorie-exemple-8');

	// et si il y a aucune sidebar pour la catégorie de cet article

} else {

// on affiche celle par défaut 

    get_sidebar(); 

}

?>

Mots clés:





19 Commenataires pour :

“Afficher une sidebar en fonction de la catégorie de l’article consulté”

  1. Corinne dit :

    Comme c’est là, je ne vais pas pouvoir le faire aujourd’hui, mon thème est ultra compliqué 🙁 C’est d’autant plus frustrant que j’ai la solution sous les yeux!
    Je vous remercie pour le tuto, je vais essayer de l’appliquer tant bien que mal.

    • Fred dit :

      Il y a plusieurs méthodes mais celle la est la plus simple que je connaisse, le mieux c’est d’installer votre thème en locale pour faire les modifications, il faut que vous trouvez les fichiers : qui affiche l’article seul, celui de la sidebar et le fichier function de votre thème. Avec un peu de patience ça va le faire.

  2. Corinne dit :

    Bon, thème superbe et très complet, trop pour moi. J’ai trouvé le plugin « Conditional Widgets » en compensation pour oublier cette déception^^
    Il a la particularité de proposer ou non l’affichage d’un widget dans la sidebar par défaut du blog… un peu long à paramétrer selon le nombre en place mais il fait bien son travail et respecte mes css.

    En tout cas, merci pour ce tuto, il sera certainement utile à d’autres personnes. Je vais faire le tour de votre site, j’ai vu d’autres choses intéressantes 😉

  3. Nakota dit :

    Bonjour,

    Merci beaucoup pour ce tuto qui correspond exactement à ce que je recherchais ! J’aurais quand même deux questions :
    – Il est préférable de suivre ce tuto ou d’installer une extension qui remplisse la même fonctionnalité ? J’ai toujours la crainte de ralentir mon site internet à force d’installer des extensions
    – Lors d’une mise à jours de WP ou du thème WP installé, les fichiers modifiés ne vont t’il pas retourner à leur état d’origine ?

    Merci beaucoup.

    • Fred dit :

      Bonjour Nakota,

      Pour répondre à votre première question, il est préférable d’ajouter le code directement dans le thème, car effectivement si je devais en faire un plugin de ce code je devrais rajouter beaucoup plus de ligne et de fonctions ce qui rendrait le code plus important. Après le nombre de plugins que vous ajouté dépend aussi de leurs fonctions, les plugins qui ralentisse le plus se sont qui charge des fichiers javascript exemple les extensions pour des réseaux sociaux.

      Pour la mise à jour uniquement de WordPress ca effacera pas les modifications que vous avez apportées a votre thème par contre si vous mettez le thème a jour la vous perdrez vos modifications.

  4. Nakota dit :

    Re-bonjour,

    J’aurais une autre question : Mon souhaite est d’afficher une sidebar différente selon la catégorie où le visiteur se trouve. Suite à mes recherches, c’est le page index.php qui correspond à l’affichage de ces requêtes. Je remplace donc le get_sidebar() par :

    if (!is_category('12') ) { 
       get_sidebar('12');
    } else { 
       get_sidebar(); 
    }
    

    Seulement maintenant ma sidebar reste vide pour toutes les catégories. As tu une idée du pourquoi et comment résoudre ce soucis ?

    Merci à toi pour le temps accordé.

    • Fred dit :

      Tu as bien créé un autre fichier sidebar-12.php et déclaré la nouvelle sidebar dans le ficher function.php du thème ?

      • Nakota dit :

        Oui, j’ai pu trouver la source de mon pb. Mon retour s’est placé juste en dessous au lieu de se mettre à la suite de ce commentaire-ci.

        Merci beaucoup pour ton suivie en tout cas.

  5. Nakota dit :

    J’ai trouvé la source de mon pb… Je n’ai pas trop compris pourquoi mais dans mon code j’avais gardé les commentaires mis dans l’exemple ici. En les supprimant cela marche très bien !
    Dans le code que j’ai mis ci-dessus j’ai aussi oublié de supprimé le « ! » lors de mes tests.

    Encore merci pour cet excellent tuto qui, pour moi, m’a beaucoup plus aidé que les autres présent sur internet et légérement similaire.

    Bonne continuation à vous.

  6. kerplouz dit :

    Bonjour,

    Est il possible d’appliquer le meme principe à une page statique:

    Si la page statique est « toto »
    Alors afficher la sidebar « titi »

    ?

    Merci d’avance !

    • Fred dit :

      Bonjour kerplouz ,
      Vous pouvez appliquer le même principe sauf que vous éditez le fichier page.php (ou page template)
      Et vous remplacer la ligne :

      if (is_single() && in_category('categorie-exemple') )
      

      Par

      if (is_page(‘ID_de_la_page’))
      

      Désolé pour cette réponse tardive j’étais en vacance 😉

  7. bigbenz dit :

    Bonsoir,
    tuto pédagogique, une belle manière d’esquiver l’activation d’un plugin supplémentaire. Merci.

  8. tim dit :

    Super, merci bcp ça va m’être vraiment utile ! Comme quoi même 2 ans après ce post reste d’actu 🙂 !!

  9. antoine dit :

    Bonjour,
    J’aimerai utiliser votre code, car celui-ci correspond parfaitement à ce que je recherche, mais malheureusement je n’ai pas de page sidebar, celles-ci sont situés dans la page functions.php.
    Elles se présentent ainsi :

    function mh_widgets_init() {
    		global $options;
    		register_sidebar(array('name' => __('Sidebar', 'mh'), 'id' => 'sidebar', 'description' => __('Widget area (sidebar left/right) on single posts, pages and archives', 'mh'), 'before_widget' => '<div class="sb-widget">', 'after_widget' => '</div>', 'before_title' => '<h4 class="widget-title">', 'after_title' => '</h4>'));
    
    register_sidebar(array('name' => __('Home 1', 'mh'), 'id' => 'home-1', 'description' => __('Widget area on homepage', 'mh'), 'before_widget' => '<div class="sb-widget home-1 home-wide">', 'after_widget' => '</div>', 'before_title' => '<h4 class="widget-title">', 'after_title' => '</h4>'));
    

    Il en existe plusieurs : home-1, home-2… posts 1, posts 2, footer1, footer2..
    J’utilise le theme MH magazine.

    Je vous remercie par avance du temps consacré à ma lecture.

  10. Benoist dit :

    Merci pour la qualité pédagogique de cet article pour changer les sidebars. Cela marche parfaitement

Laisser un commentaire

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Pour affiché du code HTML, CSS, PHP, JAVASCRIPT utilisé le marqueur : [code][/code]