Gutenberg est l’éditeur WordPress basé sur des blocs. L’écran peut sembler dense au début, mais il est toujours composé des mêmes zones. Ce tutoriel vous aide à repérer rapidement chaque élément : barre du haut, colonne latérale, zones d’édition, et accès au menu WordPress.
Les zones principales de l’écran#
Quand vous éditez une page ou un article, l’interface Gutenberg se découpe généralement en 4 zones :
- La barre supérieure (tout en haut)
- La zone de contenu (au centre, là où vous écrivez)
- La colonne latérale (à droite : Page / Bloc)
- Le menu WordPress (à gauche, parfois masqué en plein écran)
La barre supérieure (top bar)#
La barre supérieure contient les actions globales : navigation, outils, sauvegarde et publication.
- Plus à gauche
- Flèche ou logo WordPress (W) : ouvre le menu WordPress (ou vous ramène vers l’administration).
- Ajouter un bloc (+) : ouvre la bibliothèque de blocs pour insérer du contenu.
- Annuler – Rétablir : permet d’annuler ou rétablir une action effectuée dans le contenu central.
- Liste du document (souvent une icône “liste”) : affiche la structure de la page (titres, blocs, sections) pour naviguer rapidement.
- Au centre
- Action rapides : les actions dépendent de l’emplacement de votre curseur.
- Plus à droite
- Enregistrer : sauvegarde vos modifications (brouillon ou mise à jour).
- Prévisualiser : affiche un aperçu du rendu (souvent Desktop / Tablette / Mobile).
- Afficher / Masquer la colonne latériale de droite : pour élargir votre zone d’édition et ainsi être plus à l’aise.
- Publier : rend la page publique (ou planifie / met à jour selon le statut).
La zone de contenu (au centre)#
C’est la zone principale : vous y construisez la page avec des blocs (texte, image, galerie, colonnes, bouton, etc.).
- Chaque élément est un bloc : cliquez dessus pour le sélectionner et modifier son contenu.
- Insertion rapide : vous pouvez souvent ajouter un bloc via un bouton + dans la page, ou en tapant / (ex :
/image,/titre,/bouton). - Déplacement : un bloc peut être déplacé (glisser-déposer ou flèches selon le thème / l’interface).
Quand un bloc est sélectionné, une petite barre d’outils contextuelle peut apparaître au-dessus du bloc (ou dans la barre supérieure selon les réglages). Elle change selon le type de bloc (texte, image, bouton…).
La colonne latérale, options de la page & bloc#
À droite, la colonne latérale affiche les réglages. Elle contient deux onglets.
Afficher / masquer la colonne latérale#
La colonne de droite peut être masquée pour gagner de la place. Pour l’afficher ou la cacher :
- Cliquez sur l’icône réglages en haut à droite juste à gauche du bouton Publier ou Enregistrer.
- Si la colonne est ouverte, vous verrez “Page / Bloc”.
Onglet “Page” ou “type de contenu”#
Il regroupe les réglages généraux du contenu : statut, visibilité, organisation…
- Statut : brouillon, publié, planifié…
- Visibilité : public, privé, protégé par mot de passe (selon les droits).
- Révisions : historique des versions (si activé).
- URL / permalien : l’adresse de la page (selon le type de contenu).
- Image mise en avant (surtout pour les articles) : image principale.
- Extrait (souvent articles) : résumé pour les listes / SEO.
- Discussion : commentaires (rarement utilisé sur un site vitrine).
Onglet “Bloc”#
Il s’active dès que vous sélectionnez un bloc dans la page. Il contient les réglages du bloc sélectionné (ex : taille d’image, style de bouton, couleurs, espacements…).
Si vous ne voyez pas les réglages attendus, vérifiez que vous avez bien sélectionné le bon bloc dans la page.
Mode plein écran ou menu WordPress à gauche#
Par défaut, Gutenberg utilise souvent un mode plein écran qui masque le menu d’administration WordPress (le menu gris foncé à gauche) pour éviter les distractions.
Pour afficher à nouveau le menu WordPress :
- Cliquez sur le menu “⋮” (trois points) en haut à droite.
- Dans les options, désactivez Mode plein écran (ou “Fullscreen mode”).
- Le menu WordPress réapparaît à gauche.
Si vous travaillez souvent sur l’administration (réglages, menus, extensions…), désactiver le plein écran peut être plus confortable. Si vous écrivez beaucoup, le plein écran aide à rester concentré sur la page.
Sortir de l’éditeur Gutenberg#
Vous pouvez quitter l’écran d’édition à tout moment (après avoir enregistré si besoin) :
- Retour à la liste : utilisez le bouton de retour (souvent en haut à gauche) pour revenir à la liste des pages / articles.
- Menu WordPress : si le menu de gauche est visible, cliquez sur Pages, Articles ou toute autre section.
- Logo WordPress (W) : permet de revenir au tableau de bord ou à la liste des contenus.
Avant de quitter, vérifiez en haut à droite que vos changements sont bien enregistrés (brouillon, mise à jour, ou publié).
Récapitulatif rapide#
- Barre du haut : ajouter des blocs, structure, aperçu, enregistrer, publier.
- Centre : votre contenu en blocs.
- Barre latérale droite : réglages “Page” (statut, visibilité) et “Bloc” (options du bloc sélectionné).
- Menu WordPress : parfois masqué par le mode plein écran, réactivable via ⋮ > Mode plein écran.