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 !
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é :
1/ Archives
Le 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
Ce 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
Ce 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
Ce 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
Ce 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
Ce 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
C’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é
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
Ce 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
Une 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
Ce 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
Si 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
Ce 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
Ce 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
Ce 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
Certainement 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
Tout 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)
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…
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 ?
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
Ce 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
Ce 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
Ce 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
Ce 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”.
Aller plus loin avec les Widgets et les Sidebars
Afficher une barre latérale différente selon la catégorie
Et si je vous disait qu’il est possible d’afficher une barre latérale différente en fonction de la catégorie dans laquelle vous vous trouvez, ou encore de personnaliser la sidebar qui s’affiche pour un auteur donné, un article, une page, une étiquette… mais aussi de créer des barres latérales temporaires qui s’affichent uniquement selon un calendrier prédéfini, et même de personnaliser le design de ces dernières… Cool non ?
Tout ceci est possible avec le plugin Lightweight Widget Area Plugin – Content Aware Sidebars ;)
Rendre vos Widgets fixes lors du scroll (Sticky)
Utilisez le plugin Q2W3 Fixed Widget pour WordPress pour créer des widgets “gluants” (sticky) qui restent dans la zone d’écran visible lorsque la page est scrollée vers le haut ou vers le bas.
Les Widgets sticky sont bien plus visibles par vos visiteurs que les autres et ont donc un taux de clics nettement plus élevé. Par conséquent, cette option est particulièrement utile pour les annonces ou autres éléments avec lesquels les visiteurs souhaitent interagir.
En conclusion…
Il est vrai que WordPress a énormément de widgets simples de compréhension et d’utilisation, mais WordPress c’est beaucoup plus que ça puisqu’il représente aussi de nombreux avantages. WordPress est très facile et rapide à installer, ce qui réduit énormément les coûts d’un site développé à l’aide de WordPress. Ce CMS est très agréable en termes d’ergonomie, il est facile de s’adapter à son environnement, en ajoutant, supprimant et en modifiant les pages. C’est un véritable jeu d’enfant ! De nombreuses personnes utilisent WordPress et la communauté ne cesse de s’agrandir. Il y a donc une forte présence sur internet et de nombreux forums existent si vous avez besoin d’aide ou des réponses à vos interrogations. Grâce à cette communauté, de nombreux thèmes, plug-ins et autres modules ont vu le jour, ce qui rend votre site encore plus personnalisable et presque sans l’aide de développeurs. Autre avantage non négligeable, il faut savoir que le CMS est très apprécié par les référenceurs. Votre site sera donc plus facilement trouvable dans les moteurs de recherche. Il n’empêche qu’un travail complet, sur le long terme devra être réalisé concernant le référencement naturel, payant, ergonomie, le suivi analytique ou encore les réseaux sociaux.
Tout ne peut pas être tout beau, tout rose, WordPress comporte bien évidemment quelques inconvénients. Le premier n’étant pas des moindres puisque cela concerne la sécurité. Les plus réputés des CMS sont évidemment ceux qui sont le plus victimes de piratage. Il faut donc prêter une extrême attention à l’installation des plug-ins non officiels puisqu’ils peuvent être accompagnés de scripts qui mettent en danger votre site web. Des manipulations seront donc fondamentales pour rendre votre site sûr et sécurisé. Ensuite, il y a des thèmes qui peuvent être beaucoup plus compliqués à installer. Ils nécessitent beaucoup plus de temps pour que vous puissiez bien comprendre le système et pour que vous puissiez mettre en place votre site comme vous le désirez. Il y a un autre inconvénient sur WordPress qui est à prendre en compte. Il n’est pas conseillé d’y ajouter trop de plugins. En effet, le site mettra de plus en plus de temps à se charger, certains plugins ne sont pas compatibles oui suivis et cela peut avoir des répercussions. Il faut donc analyser et anticiper tous ces points, avant de concevoir son site internet.
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 ?
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é” :
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…
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 ;-)
Voilà de quoi agrémenter intelligemment vos barres latérales, toutefois n’en abusez pas.
Rappelez-vous que moins d’informations = plus d’actions !