Afficher différentes sidebar dans votre thème WordPress

Dans se tutoriel vous allez apprendre créer plusieurs sidebar et comment les affichés sur vos pages et articles, sans ajouter de ficher supplémentaire.

La première étape est de déclarer les sidebar(colonnes latérale) dans le fichier function.php de votre thème, ouvrer le fichier puis ajouter le code ci-dessous :

function register_my_widget_theme()  {

// sidebar pour les pages

	register_sidebar(array(

		'id' => 'page-sidebar', // identifiant

		'name' => 'Sidebar Page', // Nom a afficher dans le tableau de bord

		'description' => 'Sidebar pour mes pages.', // description facultatif

		'before_widget' => '<li id="%1$s" class="widget %2$s">', // class attribuer pour le contenu (css)

		'after_widget' => '</li>',

		'before_title' => '<h2 class="widgettitle">', // class attribuer  pour le titre (css)

		'after_title' => '</h2>',

	));

// sidebar pour lers articles	

	register_sidebar(array(

		'id' => 'article-sidebar', // identifiant

		'name' => 'Sidebar Article', // Nom a afficher dans le tableau de bord

		'description' => 'Sidebar pour mes articles.',// description facultatif

		'before_widget' => '<li id="%1$s" class="widget %2$s">', // class attribuer pour le contenu (css)

		'after_widget' => '</li>',

		'before_title' => '<h2 class="widgettitle">', // class attribuer  pour le titre (css)

		'after_title' => '</h2>',

	));

}

add_action( 'init', 'register_my_widget_theme' );

‘id’ => ‘page-sidebar’  est l’identifiant  qui va permettre afficher la sidebar.

‘name’ => ‘Sidebar Article’ est tous simplement le nom de la sidebar  qui s’affichera dans le tableau de bord.

‘description’ => ‘Sidebar pour mes pages.’ Ici vous pouvez ajouter une description  de la fonctionnalité de la sidebar

‘before_widget’ => ‘<li id= »%1$s » class= »widget %2$s »>’ est le début de la balise ou sera placer le contenu des widget.

‘after_widget’ => ‘</li>’ Fermeture la balise

‘before_title’ => ‘<h2>’ est le débute de la balise h2 qui va contenir les titres des widgets

‘after_title’ => ‘</h2>’ fermeture de la balise h2.

Vous pouvez changer les class et les identifiants si vous avez besoin de créer un style différent  pour vos sidebar.

Affichage des sidebar

Maintenant que vos sidebar son déclarer dans le thème  vous allez ajouter le code suivant pour les affichés.

Pour les page ouvrez le fichier page.php et remplacer <?php get_sidebar(); ?> par :

<div <div id="sidebar">

<ul>

<?php dynamic_sidebar('page-sidebar'); ?>

</ul>

</div>

Pour les articles même procédure ouvrez le fichier single.php et remplacer par :

<div <div id="sidebar">

<ul>

<?php dynamic_sidebar('article-sidebar'); ?>

</ul>

</div>

Astuce

Si voulez pour quelque raison que ce soit ne plus afficher une sidebar différente pour vos pages et articles et remetre celle par défaut il vous suffi d’ajouter le code ci-dessous dans les fichiers single.php et page.php en remplacement de celui que je vous ai indique plus haut.

<div id="sidebar">

<ul>

<?php if ( is_active_sidebar('page-sidebar')) : ?> <!--  si il y a des Widgets dans cette sidebar elle sera afficher -->

<?php dynamic_sidebar('page-sidebar'); ?>

<?php else : ?> <!-- si cette sidebar est sans widget afficher la sidebar par défaut -->

</ul>

</div>

<?php get_sidebar(); ?> <!-- la sidebar par défaut -->

<?php // ou un autre contenu ?>

<?php endif; ?>

Vous pouvez ajouter autant de sidebar que vous avez besoin si vous avez des page template, en ajoutant un nouvel identifiant pour chaque nouvelle sidebar.