On vous dit tout sur les Widgets WordPress !

WordPress est un CMS hautement personnalisable. Non seulement on peut utiliser des thèmes tout prêts, on peut créer son propre thème, on peut ajouter des fonctionnalités à l'aide d'extensions mais on peut également faire appel à des Widgets...

Les Widgets de WordPress sont très appréciés car ils facilitent le travail de conception d'un site et l'expérience utilisateur. Dans cet article, nous allons faire un focus sur ce qui a fait (entre autres) le succès de WordPress : les Widgets !

Widgets de WordPress

Qu’est-ce qu’un WIDGET WordPress ?

Un widget est une sorte de petit module que l’on insère dans une zone prédéfinie d'un site WordPress, en général dans la sidebar (barre latérale) ou dans le footer (pied de page). Les widgets se gèrent depuis l’onglet Apparence > Widgets et se construisent par de simples glisser-déposer, comme vous pouvez le voir dans cette vidéo :

 

Les Widgets "de base" sous WordPress

Par défaut, lors de l'installation de votre site, WordPress met à votre disposition 17 modules différents dont 6 sont déjà présents dans la zone de Widget "SideBar".

Toutefois, il faut garder à l'esprit que ces widgets varient en fonction du thème activé mais aussi en fonction des plugins que vous installez. Ainsi, il ne serait pas étonnant de se retrouver avec une vingtaine ou une trentaine de Widgets au total !

La liste des 17 Widgets embarqués et leur utilité :

widgets WordPress

1/ Archives

1 - widget archivesLe widget Archives de WordPress permet d'afficher vos archives d'articles publiés mensuellement, avec en option, la quantité d'articles publiés. Ce widget n'est pas très utile, surtout si vous n'êtes pas très actif sur votre blog ou que vous ne souhaitez pas proposer à vos lecteurs une navigation par date.

2/ Articles Récents

2 - widget articlesCe widget permet d'afficher les X derniers articles de votre blog sous forme de liens. En option, vous pourrez également afficher la date de publication. Ce widget peut s'avérer utile bien que l'utilisation d'un plugin de "Related Post" par catégorie serait plus pertinente.

3/ Calendrier

3 - widget calendrierCe widget pourrait aisément prendre le terme de GADGET sans problème ! Il s'agit d'un calendrier qui affiche les dates de parution de vos articles. Cela n'est pas vraiment pertinent et je cherche encore son utilité ^^

4/ Catégories

4 - widget categoriesCe widget est plutôt intéressant car il va afficher vos différentes catégories. Cela peut permettre à l'internaute de naviguer facilement en fonction des thématiques qui l'intéressent.

5/ Commentaires récents

5 - widget commentairesCe widget affiche tout simplement les derniers commentaires saisis sur vos divers articles. Néfaste d'un point de vue SEO, quel est l'intérêt ? Je n'en sais rien !

6/ Flux

6 - widget fluxCe widget traite les flux RSS, vous pourriez donc afficher les derniers articles en provenance de flux RSS de sites externes. Vous pourriez aussi afficher votre propre flux mais ce n'est pas sa vocation première et d'autres widgets font ça bien mieux.

7/ Galerie

7 - widget galerieC'est l'un des derniers widgets que WordPress a ajouté. Il vous permet d'ajouter plusieurs images à la fois afin de créer une galerie photo. Vos images s'afficheront en miniature. Si l'internaute clique, le média affiche "la page du fichier joint", ce n'est pas très intéressant...

8/ HTML personnalisé

8 - widget html personnaliséCe widget fait partie de la liste des widgets ajoutés dernièrement. Il vous permettra d'insérer facilement du code HTML. Cela peut être très intéressant selon l'utilisation que vous en faite.

9/ Image

9 - widget imageCe widget a longtemps été très attendu. Il permet, enfin, d'ajouter une image en la sélectionnant directement depuis la bibliothèque de médias et d'y ajouter, optionnellement, un lien (une URL de destination). Ce widget me parait primordial, vous pourrez ainsi ajouter facilement des bannières, des publicités ou des encarts visuels liés avec certaines pages de votre site.

10/ Menu de navigation

10 - widget menuUne fois que vous aurez créé des menus dans l'onglet Apparence > Menus, vous pourrez les afficher grâce à ce widget. Ce dernier peut être intéressant si toutes vos zones de menus sont déjà utilisées.

11/ Méta

11 - widget metaCe widget n'a pas d'option à part celle d'ajouter un titre. Si vous l'insérez dans votre zone de widget préférée, vous obtiendrez une liste de liens tels que la connexion à votre backoffice, le lien vers vos flux RSS ou le lien du site de WPFR.

12/ Nuage d'étiquettes

12 - widget nuage etiquetteSi vous l'utilisez, ce widget affichera une liste des étiquettes utilisées dans votre blog. La taille de chaque étiquette variera en fonction du nombre d'articles contenus dans celle-ci. Les étiquettes sont une manière de classer vos contenus. Si vous ne les utilisez pas à bon escient, il est déconseillé de s'en servir car cela peut-être un obstacle au référencement naturel de votre site (contenu dupliqué).

13/ Pages

13 - widget pageCe widget liste tout simplement les pages de votre site. Dans les options disponibles, vous pourrez choisir l'ordre d'affichage ainsi que les pages à exclure, toutefois, le menu principal de votre site est généralement suffisant, n'est-ce pas ?

14/ Rechercher

14 - widget rechercherCe widget permet de proposer à l'internaute un champ de recherche en saisissant un simple mot-clé. Si le thème que vous utilisez ne le propose pas nativement, cela peut-être intéressant de l'insérer dans votre sidebar afin d'améliorer l'expérience utilisateur.

15/ Son

15 - widget sonCe nouveau widget vous permet d'insérer un fichier audio cliquable directement depuis votre zone de widget. Si votre blog est axé sur l'audio ou les podcasts, vous en aurez certainement besoin.

16/ Texte

16 - widget texteCertainement le widget le plus utilisé au monde ! Ce module vous permettra de faire tout un tas de chose : ajouter du texte enrichi, définir une mise en forme et surtout ajouter des shortcodes utiles à votre blog.

17/ Vidéo

17 - widget videoTout comme le widget son, le widget vidéo vous permettra d'insérer facilement une vidéo disponible dans votre bibliothèque de médias.

 

Les différentes zones de Widgets

Nous en avons déjà parlé un peu plus tôt dans cet article, les zones de widgets sont des emplacements spécifiques dans lesquels vous pourrez ajouter vos widgets. Ces zones sont prédéfinies lors du développement du thème, ce qui signifie qu'en fonction de celui-ci vous trouverez plus ou moins de zones possibles. Par défaut, lorsque vous installez WordPress, le thème Twenty-Seventeen est activé et propose 3 zones de widgets :

  • Colonne latérale du blog (sidebar à droite de votre contenu)
  • Pied de page 1 (zone gauche du footer de votre site)
  • Pied de page 2 (zone droite du footer de votre site)

zones pour insérer les Widgets de WordPress - thème TwentySeventeen

Nota : les widgets placés dans la Sidebar apparaîtront uniquement dans votre blog et vos articles alors que les widgets placés dans le Footer seront visibles sur tout votre site.

 

=> Les Widgets dans la SIDEBAR

Cette partie de votre site est plutôt intéressante car vous pourrez vous en servir comme une "zone de promotion" et y placer des éléments importants comme l’encart d’inscription à une newsletter, un contenu que vous souhaitez mettre en avant, les liens vers vos réseaux sociaux ou même des bannières AdSense si vous désirez monétiser votre blog.

Nota : en version mobile, les widgets contenus dans votre Sidebar viendront se positionner à la fin de votre article, les uns en dessous des autres. Ainsi, si vous avez ajouté 15 plugins, il faudra scroller longtemps pour atteindre le footer de votre site.

 

=> Les Widgets dans le FOOTER

Étant donné que cette zone de widget sera présent sur toutes les pages de votre site, je vous conseille d'y placer les éléments les plus importants. Cela peut-être les horaires d'ouverture de votre boutique, vos coordonnées, un encart de newsletter, une Google Map etc...  Selon les thèmes, il n’est pas rare de trouver 4 zones de widgets dans un footer.

Nota : tout comme les widgets placés dans la barre latérale, les widgets placés dans le pied de page se positionneront les uns en dessous des autres sur les versions mobiles ET après les widgets de la sidebar. Ce qui signifie que ces fameuses informations tant importantes en version desktop ne seront pratiquement jamais vues en version mobile... 

widget wpformation

 

Comment obtenir une nouvelle zone de Widgets ?

Cette histoire de placement des widgets en version mobile peut être un vrai problème, c'est pourquoi vous pourriez avoir besoin de créer de nouveaux emplacement pour vos widgets comme par exemple juste en dessous du header ou même au dessus, pourquoi pas ? Ou bien vous aimeriez avoir une sidebar différente en fonction de vos Posts Types : un sidebar spéciale pour vos pages, une autre pour vos articles ou même une pour vos archives de catégories. Et bien tout cela est possible : ce n'est pas très compliqué mais il faudra quand même mettre les mains dans le code... Si vous avez envie de vous lancer, je vous invite à lire cet article où tout est expliqué pas à pas.

Astuce : vous pouvez également ajouter une nouvelle zone de widget dans votre backoffice que vous ne feriez PAS apparaître du côté visiteur (Front). Quel avantage ? Vous pourriez y placer des widgets temporairement afin de conserver tous leurs réglages, des plugins que vous avez besoin d'activer ou de désactiver périodiquement. De ce fait, à chaque fois que vous avez besoin de ce widget, vous pourrez le glisser-déposer dans une zone de widget active et il sera déjà paramétré et prêt-à-l'emploi.

 

Comment supprimer les Widgets de WordPress inutiles ?

Supprimer totalement des widgets dans le backoffice

Vous trouvez que de nombreux widgets sont inutiles ? Vous souhaitez les faire disparaitre de votre backoffice ? C'est possible ! Une fonction de WordPress vous permet de désactiver les widgets indésirables...

Pour cela, vous aurez besoin d'un thème enfant. Dans le fichier functions.php de celui-ci, il vous faudra ajouter un simple bout de code tel que :

function remove_calendar_widget() {
	unregister_widget('WP_Widget_Calendar');
}

add_action( 'widgets_init', 'remove_calendar_widget' );

Ce bout de code, par exemple, vous permettra de supprimer le widget calendrier. Si vous désirez supprimer plusieurs widgets à la fois, votre bout de code devrait ressembler à cela :

function remove_widgets() {
 unregister_widget('WP_Widget_Media_Video');
 unregister_widget('WP_Widget_Media_Image');
 unregister_widget('WP_Widget_Meta');
 unregister_widget('WP_Nav_Menu_Widget');
 unregister_widget('WP_Widget_Pages');
 unregister_widget('WP_Widget_Calendar');
 unregister_widget('WP_Widget_Archives');
}

add_action( 'widgets_init', 'remove_widgets' );

Il vous suffira d'utiliser le bon "objet". Pour les connaitre en voici la liste :

  • WP_Widget_Pages
  • WP_Widget_Calendar
  • WP_Widget_Archives
  • WP_Widget_Links
  • WP_Widget_Media_Audio
  • WP_Widget_Media_Image
  • WP_Widget_Media_Video
  • WP_Widget_Meta
  • WP_Widget_Search
  • WP_Widget_Text
  • WP_Widget_Categories
  • WP_Widget_Recent_Posts
  • WP_Widget_Recent_Comments
  • WP_Widget_RSS
  • WP_Widget_Tag_Cloud
  • WP_Nav_Menu_Widget
  • WP_Widget_Custom_HTML

Si vous désirez en savoir d'avantage, je vous invite à lire la documentation officielle du Codex de WordPress.

 

4 plugins pour vos widgets que vous allez adorer...

1/ Widget CSS Classes

plugin widget css classesCe plugin vous permet d'ajouter simplement des ID ou des classes à vos widgets afin de les customiser plus facilement avec du CSS.

2/ Options des Widgets

plugin options des widgetsCe plugin vous permet de contrôler vos widgets, d'attribuer différents contenus en fonction des types de posts, de choisir les widgets à afficher selon les tailles d'écran, d'ajouter des ID et des classes CSS et bien plus encore. Une fois installé, de nouveaux onglets d'options apparaîtront sur vos widgets.

3/ Widget Logic

plugin widget logicCe plugin donne à chaque widget la possibilité de saisir un champ de logique conditionnelle proposé par WordPress (les marqueurs conditionnels) ce qui vous permettra de contrôler les pages sur lesquelles le widget apparaîtra. Le champ autorise donc le PHP ce qui pourrait poser un problème si vous faites des erreurs ou si votre back-office tombe entre de mauvaises mains.

4/ AMR shortcode any widget

plugin shortcode any widgetCe plugin permet d'obtenir un shortcode pour un widget ou même une zone de widget afin de l'utiliser à des endroits spécifiques comme des pages ou des articles par exemple. Il vous suffira de paramétrer vos widgets dans une zone de widget normale pour ensuite les glisser dans la zone appelée "widgets for shortcode".

 

En conclusion...

On vous a tout dit sur les widgets de WordPress ! Si vous êtes tout nouveau sur ce CMS, ils n'auront plus de secrets pour vous. Ah si pardon ! Voici trois autres choses dont j'ai oublié de vous faire part :

1/ Comment retirer un widget d'une zone ?

widgets sidebar default

Vous avez mis un widget dans votre sidebar pour le tester mais celui-ci ne vous convient pas ? C'est très simple, il suffit de cliquer sur "supprimer"...

2/ Le backoffice propose une version en mode "accessibilité" :

widget accessibility

Si le mode classique ne vous convient pas, vous pouvez passer en mode accessibilité. Pour cela, dans l'écran Apparence > Widgets, cliquez sur "options de l'écran", tout en haut à droite puis optez pour "Activer le mode Accessibilité". L'écran de contrôle des widgets va alors se modifier et vous donnera accès à un autre mode de fonctionnement.

3/ N'oubliez pas d'enregistrer...

Ne pas oublier d'enregistrer vos widgets

Bien entendu, je n'en ai parlé mais je précise qu'il ne faut pas oublier d'enregistrer vos changements ou vos réglages lorsque vous insérez un widget dans une zone, sinon celui-ci ne sera pas pris en compte ;-)

Il existe de nombreux widgets disponibles pour WordPress, si leur utilité est certaine ne les utilisez pas tous. Rappelez-vous que moins de choix implique plus d'action. Aussi, je vous conseille la lecture complémentaire des articles suivants :

On vous dit tout sur les Widgets WordPress !
5 pour 15 votes

A propos de l'auteur...

Lycia Diaz

Freelance WordPress, Rédactrice Web et Webdesigner, je suis passionnée par le monde du web et de l'environnement Apple... Je tiens également un blog qui traite de ces sujets. J'adore découvrir, tester et partager mes expériences mais aussi créer et réaliser de nouveaux projets ! Je suis auteure d'un guide complet sur WordPress.

Vous pouvez laisser votre commentaire ci-dessous et même vous abonner aux commentaires de l'article.
Nota: pour le champ "Site Web", seuls les liens vers vos réseaux sociaux sont autorisés.

Likez, Tweetez, Commentez, Partagez !

88 Partages
Partagez41
Tweetez34
Partagez6
Buffer7