2.3Widgets & zones (barres latérales, pied de page)
L'essentiel en 30 secondes
- Les zones secondaires (barre latérale, pied de page) accueillent des widgets ou des blocs : recherche, catégories, coordonnées, réseaux sociaux.
- Le pied de page est stratégique : coordonnées, menu secondaire, mentions légales, réseaux — il rassure et convertit.
- Sobriété : quelques éléments utiles par zone ; une colonne interminable noie l'information.
Mini-cas filé — le pied de page de l'atelier
Samir doit compléter les zones secondaires du site de Hassan. Le pied de page doit donner les coordonnées de l'atelier, un lien vers les mentions légales et les réseaux sociaux. Hassan voudrait aussi y ajouter une dizaine de badges et un carrousel. Samir le convainc de rester sobre : quelques éléments utiles valent mieux qu'une zone surchargée.
Suite du cas 2.2 — l'identité est posée, on complète les zones.
1. Widgets, blocs et zones
Au-delà du contenu principal, un site possède des zones secondaires : la barre latérale (sidebar), le pied de page, parfois un bandeau. On y place des widgets sur les thèmes classiques (Apparence → Widgets), ou des blocs dans les parties de modèle sur les thèmes de blocs. Ces éléments enrichissent la navigation : recherche, catégories, derniers articles, coordonnées.
Toutes les zones ne sont pas présentes partout : certains thèmes n'affichent pas de barre latérale, et le pied de page peut comporter plusieurs colonnes. Samir vérifie ce que propose le thème avant de remplir, pour ne pas créer de zones vides ou incohérentes.
2. Un pied de page utile et sobre
Le pied de page est souvent le dernier endroit consulté avant de contacter un artisan : il doit contenir les coordonnées, un menu secondaire (contact, mentions légales, politique de confidentialité) et éventuellement les réseaux sociaux. C'est un espace de confiance, pas un mur de publicité.
La règle est la sobriété : quelques éléments utiles par zone. Une barre latérale surchargée détourne l'attention du contenu ; un pied de page encombré perd le visiteur. Samir teste chaque ajout avec une question simple : « est-ce que cela sert le visiteur ? » Sinon, il retire.
🔎 Exemple concret — Composer le pied de page (cas Samir)
Colonne 1 : logo + phrase de présentation courte.
Colonne 2 : coordonnées (téléphone, e-mail, adresse).
Colonne 3 : menu secondaire (Contact, Mentions, Confidentialité).
Bas de page : réseaux sociaux + copyright.
→ Retirer badges et carrousel inutiles.
Résultat : un pied de page clair qui inspire confiance.
Leçon : chaque colonne a un rôle identifiable.
Vocabulaire de la section
- Widget / bloc de zone
- Élément placé dans une zone secondaire : recherche, catégories, coordonnées, réseaux.
Exemple simple : un bloc de coordonnées dans le pied de page.
Ce que ce n'est pas : confondre widget et extension.
Réflexe : zone secondaire = widget ou bloc.
- Barre latérale
- Colonne latérale du contenu : navigation secondaire, recherche, mises en avant.
Exemple simple : une sidebar avec recherche et catégories sur le blog.
Ce que ce n'est pas : la remplir de publicités sans rapport.
Réflexe : sidebar = complément, pas concurrent du contenu.
- Pied de page
- Bas de chaque page : coordonnées, menu secondaire, mentions légales, réseaux.
Exemple simple : le footer de l'atelier rassure avant le contact.
Ce que ce n'est pas : y empiler badges et carrousels.
Réflexe : footer = confiance et conversion.
- Zone de widgets
- Emplacement défini par le thème où déposer widgets ou blocs.
Exemple simple : le thème propose « pied de page 1, 2, 3 ».
Ce que ce n'est pas : créer du contenu dans une zone non affichée.
Réflexe : vérifier les zones du thème avant de remplir.
- Sobriété
- Règle de conception : quelques éléments utiles par zone, sans surcharge.
Exemple simple : trois colonnes suffisent pour l'atelier.
Ce que ce n'est pas : remplir chaque zone au maximum.
Réflexe : utile > nombreux.
En pratique — Enrichir les zones secondaires avec mesure
- Repérez les zones proposées par votre thème (Apparence → Widgets ou parties de modèle).
- Composez un pied de page utile : coordonnées, menu secondaire, réseaux.
- Si une barre latérale existe, ajoutez-y deux ou trois éléments pertinents au maximum.
- Relisez chaque élément : s'il ne sert pas le visiteur, retirez-le.
Script prêt à dire — défendre la sobriété (20 s)
« Votre pied de page donnera l'essentiel : comment vous joindre, les liens utiles et vos réseaux. On évite d'y empiler des badges : un visiteur qui cherche votre numéro doit le trouver en une seconde. »
Ramener chaque élément à un usage concret du visiteur.
Modèle copier-coller — plan du pied de page
COLONNE 1 : logo + présentation courte
COLONNE 2 : coordonnées (tél, e-mail, adresse)
COLONNE 3 : menu secondaire (contact, mentions, confidentialité)
BAS DE PAGE : réseaux sociaux + copyright
ÉLÉMENTS RETIRÉS (inutiles) : _______________
Vitrine locale
Coordonnées et horaires en évidence : le visiteur veut appeler ou venir.
Boutique
Liens livraison, retours et CGV dans le pied de page.
Blog
Barre latérale avec recherche et catégories, sans surcharge.
Site one-page
Pied de page compact : contact et mentions suffisent.
✓ Bonnes pratiques
- Vérifier les zones réellement affichées par le thème.
- Faire du pied de page un espace de confiance.
- Retirer tout élément qui ne sert pas le visiteur.
✗ Pièges fréquents
- Empiler badges et carrousels dans le footer.
- Remplir une sidebar de publicités.
- Créer du contenu dans une zone non affichée.
Points clés à retenir
- Widgets ou blocs animent les zones secondaires.
- Le pied de page est stratégique : contacts, menu, mentions.
- Sur thème de blocs, les zones passent par les parties de modèle.
- Sobriété : quelques éléments utiles par zone.
Défi 48h — appliquez demain
Composez un pied de page en trois colonnes (présentation, coordonnées, liens utiles) et supprimez tout élément qui ne sert pas le visiteur. Vérifiez le rendu mobile. 15 minutes.
- Je place des widgets ou blocs dans les bonnes zones.
- Je construis un pied de page utile.
- J'applique la sobriété dans les zones secondaires.
Questions fréquentes
Où sont passés les widgets sur mon thème ?
Sur un thème de blocs (FSE), les widgets sont remplacés par des blocs dans les parties de modèle (en-tête, pied de page). L'entrée Apparence → Widgets peut ne plus exister ; tout se fait dans l'éditeur de site.
Faut-il une barre latérale sur toutes les pages ?
Non. Elle est utile sur un blog ou un site à contenu riche, mais peut distraire sur une page de vente ou une page contact. Beaucoup de thèmes permettent de la désactiver par page ou par modèle.
Que doit obligatoirement contenir le pied de page ?
Au minimum un lien vers les mentions légales et la politique de confidentialité, ainsi qu'un moyen de contact. Pour un site professionnel, ajoutez les coordonnées et éventuellement les réseaux sociaux.
Le pied de page de l'atelier doit aider le visiteur. Que privilégier ?