Développeur web & bien plus encore

WordpressCréer plusieurs sidebar pour WordPress et ses Widgets

Créer plusieurs sidebar pour WordPress et ses Widgets

WordPress est un CMS très malléable qui vous permet de personnaliser votre site de fond en comble. Cet article porte sur la customisation de la barre de menu latérale (sidebar) mais vous pouvez l’adapter pour créer de nombreuses zones de widgets à travers vos pages.

Tout dépend, à vrai dire, du type de site que vous êtes en train de construire :

  • un blog demandera principalement des widgets en sidebar latérale droite ou gauche
  • un site vitrine pourra demander des widgets dans le footer, dans le header ou à d’autres endroits sur les pages

Le but étant de retrouver dans votre administration (Apparence > Widget) des zones multiples qui se chargeront de personnaliser les différents espaces avec des widgets.

1ère Etape : Functions.php

Il est nécessaire de travailler dans le fichier functions.php de votre thème WordPress. Vous devrez alors renseigner les nouvelles zones de widget comme ceci :

if ( function_exists('register_sidebar') ) {
    register_sidebar(array(
        'name' => 'Header',
        'before_widget' => '<div id="header">',
        'after_widget' => '</div>',
        'before_title' => '<h2>',
        'after_title' => '</h2>',
    ));
    register_sidebar(array(
        'name' => 'Footer',
        'before_widget' => '<div id="footer">',
        'after_widget' => '</div>',
        'before_title' => '<h3>',
        'after_title' => '</h3>',
    ));
}

Comme son nom l’indique register_sidebar va se charger de créer une nouvelle zone avec un tableau contenant diverses informations (le nom de la zone, communément les balises avant le widget ainsi que le titre de celui-ci)

2ème Etape : Ajouter la nouvelle zone widgets à votre thème WordPress

Il vous suffit désormais de choisir l’emplacement de ces nouvelles zones de widget. Par exemple, si vous souhaitez ajouter un widget en footer, modifiez le fichier footer.php du template et ajoutez y le code suivant à l’emplacement souhaité :

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer') ) : endif; ?>

Et le tour est joué !

3ème Etape : Ajouter de nouveaux widgets à vos nouvelles zones

Il vous reste à glisser déposer les widgets dans vos nouveaux espaces 😉