Plusieurs sidebars pour WordPress, c’est possible !

Je suis loin d’être le premier à aborder le sujet mais je tenais tout de même à rédiger ce billet n’ayant pas trouvé les ressources adéquates au moment opportun.
Certes, en cherchant bien, on finit effectivement par dénicher des tutos relativement clairs… mais allez, ça me fait plaisir de vous exposer les choses à ma façon .

Pour les non-anglophones, vous l’aurez saisi je pense, « sidebar » signifie « barre latérale ». Depuis la version 2.3 de WordPress la personnalisation de cette partie du site est désormais facilitée avec l’apparition des widgets, petits objets « pré-codés » que l’on retrouve dans le menu « apparence » de l’interface d’administration et qu’il nous est possible de glisser-déposer à droite de l’écran pour alimenter notre colonne.

Le fichier de base de WordPress relatif à la barre latérale se nomme sidebar.php. Nous pourrions très bien reprendre le fichier du thème « classique », allégé en code, mais je préfère pour la compréhension que nous partions d’un fichier vierge dans lequel nous allons rajouter la fonction nécessaire au fonctionnement de sa widgetisation (ne cherchez pas dans le dictionnaire) .

<ul>
     <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>     /*Si les widgets ont été rajoutés depuis l'administration alors on déclenche la sidebar dynamique*/
/*S'il n'y a aucun widget de configuré, tout ce qui est placé à cet endroit s'affiche dans votre sidebar*/
     <?php endif; ?>
</ul>

Ce bout de code fonctionne à merveille pour une sidebar unique et il suffit pour la plupart des situations. Mais comme on aime se compliquer l’existence et que l’on s’est mis en tête d’intégrer plusieurs barres latérales dans notre thème, nous allons alors compléter légèrement ce dernier.
Pour cela, il va nous falloir nommer notre première sidebar en lui attribuant un id que nous allons placer par ailleurs en paramètre de la fonction dynamic_sidebar();.

<div id="barre1">
<ul>
     <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('barre1') ) : ?>     /*On reporte le nom de l'id comme paramètre de la fonction*/
     <?php endif; ?>
</ul>
</div>

Voici donc le code de notre sidebar par défaut que nous enregistrons sous le nom sidebar.php (cela ne sert à rien de renommer ce fichier, il fait partie de la liste prédéfinie de WordPress). Aussi, lorsqu’une seule barre latérale est utilisée, le fichier sidebar.php est automatiquement appelé via le template tag get_sidebar();.
Dans notre exercice, le nommage des différentes barres va nous permettre de les appeler de façon distinctes dans notre thème et surtout de les placer avec plus de souplesse dans notre mise en page.

<div id="droite">
     <?php get_sidebar('barre1'); ?>/*On place la fonction ainsi dans notre thème, en précisant l'id de la sidebar que l'on souhaite charger*/
</div>

La création de la seconde barre latérale n’est plus très compliquée désormais puisque nous allons copier le fichier sidebar.php pour le nommer selon le schéma d’écriture suivant : sidebar-id.php ce qui nous donne en toute logique sidebar-barre2.php.

Ce fichier contiendra donc le code suivant :

<div id="barre2">
<ul>
     <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('barre2') ) : ?>     /*On reporte le nom de l'id comme paramètre de la fonction*/
     <?php endif; ?>
</ul>
</div>

Et ce qui se traduit bien sûr dans votre thème par :

<div id="droite">
     <?php get_sidebar('barre1'); ?>
     <?php get_sidebar('barre2'); ?>
/* et ainsi de suite... */
</div>

Voilà, c’est tout . On aurait très bien pu nommer ces barres latérales différemment sans tenir compte de la structure de nommage de WordPress et les appeler à l’aide de la fonction « include », cette méthode n’est pas la seule et unique façon d’implémenter plusieurs sidebars dans un thème.