Il faut le dire, la barre latérale WordPress n’est pas très sexy (certains l’appellent ausi sidebar). D’ailleurs, je suis surpris que celle-ci n’a jamais été améliorée lors d’une mise à jour. Nous allons arranger cela en utilisant le plugin Recent Posts Widget Extended. Les blogueurs vont adorer ce qui va suivre.
Voyons ce que cela donne en image :
Par ailleurs, si tu souhaites afficher tes articles ou catégories les plus populaires dans ta sidebar, j’explique comment faire dans cet article.
Afficher la barre latérale WordPress
Pour l’exemple qui va suivre, j’utilise le thème Astra, Tu pourras utiliser un autre thème si tu en as envie.
Ajoutez une page et des articles pour la barre latérale WordPress
Pour commencer, on va créer une page Blog, et cinq articles avec par exemple du Lorem Ipsum pour le test. IMPORTANT, à chaque article, mets une image mise en avant. Pour se faire, va dans l’un des articles (là où tu écris ton texte) :
- Tout d’abord, clic sur Article
- Ensuite, sélectionne image mise en avant
- Enfin, appuie sur le rectangle gris pour choisir ton image
Nous avons de jolis articles, c’est cool ça.
Ensuite, reproduits la même action pour les autres article. Tu pourras mettre une image différente pour chaque article : le rendu sera meilleur.
Régler la lecture
Maintenant, nous allons définir notre site comme un blog, comme ça, lorsqu’on cliquera sur l’onglet blog, nous verrons les derniers article publiés :
- Pour commencer, survol Réglage
- Ensuite, clic sur Lecture
- Sélectionne le bouton radio Une page statique (choisir ci-dessous)
- Ensuite, choisies Blog
- Enfin, enregistrer les modifications
Prochaine étape, on s’assurer que notre sidebar (barre latérale) et bien présente
Découverte des widgets de la barre latérale WordPress
En faite, il y a qu’un seul widget qui nous intéresse pour le moment, celui des Articles récents, voyons s’il est présent :
- Pour commencer, survol Apparence
- Ensuite, clic sur Widgets
- Enfin, vérifie ça présence
Si, tu ne trouves pas le widget Articles récents, fais un glissé-déposé Articles récents de gauche et dépose-le dans Colonne latérale principale
Barre latérale WordPress : Installation du plugin
Voilà, nous allons enfin découvrir cette extension. Le plugin Recent Posts Widget Extanded est bien noté, il est installé sur 100 000 site c’est assez rassurant. En revanche, il n’a pas été mis à jour depuis un moment : 5 mois :
Après l’avoir téléchargé et installé on va voir ce qu’il nous cache.
Découverte de la nouvelle barre latérale WordPress
Maintenant, nous allons ajouter notre super widget très design :
- Pour commencer, survol Apparence
- Ensuite, clic sur Widgets
- Enfin, Drag and drop le nouveau widget Recent Posts Extended dans la Colonne latérale principale
Après avoir fait, le glisser et déposer, les réglages de ton nouveau widget vont s’afficher.
Comme tu peux le voir, il y a beaucoup de champs à remplir. Il n’est pas nécessaire d’indiquer tous les champs.
Barre latérale WordPress : Réglage de la colonne une
Commençons par le commencement :
- Tout d’abord, mettons un titre en français
- Ensuite, si l’on souhaite transformer son titre en lien
- Pour les amateurs de CSS, tu vas pouvoir personnaliser ta sidebar
- Entre le titre et les derniers articles, tu peux afficher le texte que tu veux
- Enfin, à la fin des derniers articles, tu vas pouvoir mettre du texte
Enregistre, et n’oublie pas d’aller voir le résultat :
Réglage de la colonne deux
En fait, il n’y a pas grand chose à faire, tout est très bien par défaut. Par contre, si tu as plusieurs catégories, tu pourras drag & drop un 2ème widget Recent Posts Extended, et sélectionner la catégorie que tu souhaites mettre en avant :
Voyons ce que ça donne :
Il est intéressant le résultat pas vrai ?
Réglage de la colonne trois
Revenons sur notre premier widget :
- Tout d’abord, on garde 5, mais on peut très bien afficher moins ou plus d’articles sur notre barre latérale en changeant le chiffre.
- Ensuite, la miniature, c’est l’image, c’est toute la puissance de ce plugin, laissons la case coché.
- Moi j’ai mis 80×80, en taille d’image, et positionné à gauche.
- Ensuite, en cochant cette case, on va pouvoir afficher le début du texte des articles
- Combien de mots souhaites-tu afficher ? pour ma part, j’ai mis 35 mots.
- Enfin, à la fin du texte, tu peux mettre un lire la suite, pour pousser le lecteur à lire un de tes articles. Mais tu peux très bien changer le nom de ce lien.
Maintenant, le résultat, je trouve les titre un peu petit, on va voir ça dans le langage CSS. Si tu ne te sens pas à l’aise avec le code, tu n’es pas obligé de mettre tes mains dans le cambouis :
Une police plus grande, pour les titres des articles avec le CSS
Tout d’abord, recherche la class .rpwe-block suivi de la balise H3. Une fois trouvé, descends quelques lignes jusqu’à celle de font-size, par défaut il y a la valeur 12, moi j’ai mis 18 en valeur, tu peux choisir une autre valeur si tu en as envie :
Plus haut, je te disais que tu pouvais créer plusieurs widget avec ce plugin. Si tu modifies le CSS de l’un, il faudra faire la même chose pour les autres widgets, sinon il y a un risque de conflit.
Par exemple, j’ai mis la valeur 18px au H3 du widget Les nouveaux articles, je vais devoir mettre la même valeur au CSS de mon widget catégorie.
Pour finir, voyons ce que ça donne. Avec les titres plus grands, cela met les articles en valeur. Avec de bonne connaissance en CSS, tu vas pouvoir modifier encore d’avantages de choses :
Ce qu'il faut retenir
Tout d’abord, l’avantage du plugin Recent Posts Widget Extanded, est de pouvoir afficher l’image mise en avant dans la barre latérale. Cela met en avant les articles, et donne l’envie de les lires. Enfin, nous avons vu, qu’il est possible de modifier tout un tas de détails, comme : la taille de l’image, la taille de la police, afficher le début du texte ou pas…
Tu en penses quoi de ce plugin ? N’hésite pas à t’exprimer
Super bien expliqué pour une débutante comme moi.
Je vais l installer ça tombe bien j utilise Astra.
Hello Nathalie,
Merci pour ton commentaire, cela fait plaisir… Si tu changes de thème, tu pourras également utiliser ce plugin 😉 dû moment que le thème à une barre latérale.
Mon dernier article devrait t’intéresser
Merci pour cet article très intéressant, il va me servir pour améliorer les pages de mon Blog ! D’ailleurs, pour la mise en page d’un article c’est la même procédure, on trouve tout dans « apparence » ? Je trouve que la mise en page de mes articles n’est pas top mais je ne sais pas comment l’améliorer sans faire de bêtises…
Hello Meryl,
Je suis vraiment ravi que mon article te plaise. Cela va dépendre des thèmes, certains ne te permettent pas de faire beaucoup de modifications alors que d’autres si. En règle général même si « apparence » te permet de modifier beaucoup d’éléments de ton site, tout ne se fera pas dans cet onglet.
Je te conseille de lire mon dernier article : il se lit rapidement 😉 :
https://libreetdigitale.com/la-parole-au-lecteur/
Super idée, je pense que ça va faire baisser mon taux de rebond et augmenter mon temps de lecture ! Merci
Hello pigeontruffleoberon99567,
Merci pour ton commentaire, c’est tout le mal que je te souhaite.
Si tu souhaites aller plus loin, mon article « La parole au lecteur » devrait t’intéresser
Merci Marc pour cet article que j’ai mis en application, c’est vraiment très bien expliqué et illustré, impeccable
Merci Emma pour ton commentaire, je suis ravi que mon article te plaise…