L’éditeur de blocs WordPress

L’éditeur WordPress aussi appelé « l’éditeur de blocs » ou « l’éditeur Gutenberg », ou plus récemment « l’éditeur de contenus » (pour le différencier de l’éditeur de site) est proposé depuis la version 5.0 (décembre 2018) comme éditeur par défaut et remplace « l’éditeur classique » utilisé sous WordPress pendant de nombreuses années.

L’éditeur de blocs de WordPress offre un large éventail de blocs qui peuvent être utilisés pour créer des publications riches en médias, avec des mises en page élaborées.

Les blocs sont les éléments que vous ajoutez pour créer des mises en page de contenu. Vous pouvez ajouter des blocs pour les paragraphes, les images, les titres, les listes, les vidéos, les galeries, etc. Vous pouvez contrôler facilement la mise en page des blocs pour créer des pages web visuellement attrayantes.

Si vous souhaitez tester cet éditeur, accédez au site de démonstration de l’éditeur Gutenberg.

L’interface de l’éditeur

Pour accéder à l’éditeur de blocs, cliquez sur le menu Articles, puis Ajouter un article ou sur le menu Pages puis Ajouter une page. L’éditeur de blocs s’ouvre alors par défaut en mode plein écran.

Interface de l’éditeur

Pour désactiver le mode plein écran, utilisez l’outil Options situé à droite dans la barre d’outils supérieure, puis décochez le Mode plein écran dans le menu déroulant.

L’interface de l’éditeur comporte 3 parties (voir la capture Interface de l’éditeur ci-dessus) :

  • La barre d’outils supérieure (en haut de l’écran, ).
  • La colonne latérale des réglages de la publication et des blocs (à droite de l’écran, ).
  • La zone centrale d’édition de contenu (au centre de l’écran, ).

L’interface peut aussi proposer la Vue en liste (à gauche de l’écran, ) et en bas de la fenêtre, le fil d’Ariane (en bas de l’écran, ) si vous avez coché respectivement les options Toujours ouvrir la vue en liste et Afficher le fil d’Ariane des blocs dans la section Interface de l‘onglet Général des Préférences, accessible en cliquant sur l’outil Options puis sur l’élément de menu Préférences en bas du menu déroulant.

Haut ↑

La barre d’outils supérieure

La barre d’outils supérieure propose les éléments suivants de gauche à droite :

  • Voir les articles / Voir les pages  – Cet outil (avec l’icône WordPress) vous permet de sortir de l’éditeur et de retourner sur l’écran Articles ou l’écran Pages, selon le type de publication en cours de modification.
  • Ouvrir/fermer l’outil d’insertion de blocs  – Cet outil permet d’accéder à l’outil d’insertion de blocs, compositions et médias qui s’affiche en colonne latérale gauche et vous permet de rechercher parmi tous les blocs, compositions et médias disponibles, celui ou celle que vous souhaitez insérer.
  • Outils  – Cet outil propose deux modes d’interaction avec les blocs : Modifier ou Sélectionner. Avec le premier mode vous pouvez modifier les blocs en utilisant la barre d’outils du bloc ou la colonne latérale des réglages ; avec le second, vous sélectionnez les blocs et vous pouvez les déplacer par glisser-déposer ou les supprimer avec la touche Suppr, si vous cliquez à l’intérieur d’un bloc sélectionné, vous basculez automatiquement en mode modification.
  • Annuler et Rétablir  – Ces outils permettent d’annuler ou rétablir des modifications effectuées auparavant, et correspondent respectivement aux raccourcis clavier CTRL + Z (⌘ + Z) et CRTL + Y (⌘ + Y).
  • Vue d’ensemble du document  – Cet outil correspond au raccourci clavier Maj + Alt + O (⌃ + ⌥ + O) et ouvre la colonne latérale gauche qui comporte deux onglets : Vue en liste et Structure. L’onglet Vue en liste vous permet d’avoir une vue hiérarchisée des blocs contenus dans votre publication, et offre de nombreuses fonctionnalités décrites dans l’article Vue en liste. L’onglet Structure vous propose des statistiques sur votre publication (nombre de caractères et de mots, temps de lecture) ainsi qu’une vue sur la hiérarchie des titres qui vous signale les incohérences en surlignant en jaune les titres dont le niveau est erroné.
  • Enregistrer le brouillon – Ce bouton n’est présent que lorsque l’état de la publication est « brouillon » et permet d’enregistrer les modifications apportées à la publication.
  • Voir  – Cet outil ouvre un menu avec des options permettant de choisir une taille d’écran entre Ordinateur, Tablette ou Mobile ainsi que Prévisualiser dans un nouvel onglet qui ouvre votre publication dans l’interface publique du site dans un nouvel onglet.
  • Voir l’article / Voir la page  – Cet outil n’est disponible que si la publication est publiée et permet d’ouvrir un nouvel onglet affichant la publication dans l’interface publique du site.
  • Publier / Mettre à jour / Planification / Planifier  – Ce bouton permet respectivement de publier la publication si elle est en brouillon, ou de la mettre à jour si elle est déjà publiée, ou de valider la planification d’un brouillon lorsque vous avez choisi une date de publication ultérieure, ou d’enregistrer les modifications de la publication planifiée.
  • Réglages  – Cet outil permet d’afficher ou masquer la colonne latérale des réglages. Le fond du bouton est noir quand les réglages sont affichés, blanc dans le cas contraire.
  • Options  – Cet outil permet d’accéder aux options de l’éditeur.

Haut ↑

La colonne latérale des réglages

Elle regroupe les réglages des publications et les réglages des blocs présentés dans deux onglets séparés : Article/Page et Bloc  ; l’onglet actif est surligné en bleu.

L’onglet Article (ou l’onglet Page) affiche tous les réglages concernant la publication elle-même, l’article Colonne latérale des réglages de pages et articles vous en détaille le contenu.

L’onglet Bloc affiche les réglages du bloc sélectionné. Si aucun bloc n’est sélectionné, cet onglet est vide. Le fonctionnement de cet onglet est décrit dans l’article Travailler avec les blocs.

Haut ↑

La zone d’édition de contenus

La zone d’édition de contenus est la zone centrale de l’éditeur, c’est là que vous allez insérer des blocs pour y saisir votre contenu. En effet, l’éditeur de WordPress utilise des blocs, transformant un document unique en une collection d’éléments distincts avec une structure explicite et facile à modifier, ce qui transforme la façon dont vous créez du contenu.

La zone d’édition propose tout en haut un champ de saisie pour le titre de la publication et une icône « + » vous permettant d’ouvrir l’outil d’insertion des blocs. Cette icône sera par la suite située sous le dernier bloc inséré, et vous pourrez la faire apparaître ailleurs dans le contenu en plaçant votre curseur entre deux blocs.

Haut ↑

La vue en liste

La vue en liste vous permet d’avoir une vue d’ensemble sur les blocs contenus dans votre publication, d’interagir avec les blocs (sélection, déplacement, suppression…). L’article Vue en liste décrit plus précisément cette partie de l’interface de l’éditeur.

Haut ↑

Le fil d’Ariane des blocs

Le fil d’Ariane des blocs offre la possibilité de bien cerner l’imbrication des blocs puisqu’il mentionne tous les blocs parents, et donc d’obtenir rapidement votre position dans le contenu. Il vous offre également un moyen rapide de sélectionner un bloc parent puisqu’il suffit pour cela de cliquer dessus dans le fil d’Ariane.

Haut ↑

Fonctionnement de l’éditeur

La vidéo ci-dessous vous montre quelques facettes du fonctionnement de l’éditeur.

Les articles suivants vous permettront d’en apprendre plus sur le fonctionnement de l’éditeur :

Cet éditeur amène avec lui une nouvelle expérience de la construction facilitée des publications. Grâce aux blocs, vous pouvez rapidement ajouter et personnaliser de nombreux médias et éléments visuels qui nécessitaient auparavant des codes courts, du code HTML personnalisé et des intégrations.



Haut ↑

FAQ

Haut ↑

L’éditeur de blocs permet-il d’éditer les publications dans l’interface publique ?

Non. Cet éditeur remplace l’éditeur classique des publications. C’est une représentation de ce que les visiteurs voient sur l’interface publique de votre site. Cependant, la mise en page et le rendu visuel de l’éditeur sont beaucoup plus proches de ce que l’on voit sur le côté public de votre site.

Haut ↑

Pourquoi mon contenu n’est-il pas le même dans l’éditeur et sur le site ?

Vous pouvez constater une variation entre votre contenu dans l’éditeur et sur le site, en grande partie à cause de la façon dont votre thème affiche différents éléments visuels. Certains thèmes incluront des styles pour aider l’éditeur à ressembler davantage à la façade du site ; d’autres non. Si votre thème comporte une barre latérale, par exemple, vous ne la verrez pas dans l’éditeur, ce qui peut affecter la largeur de votre contenu lorsqu’il s’affiche du côté public du site.

Haut ↑

Pourquoi certains réglages sont-ils disponibles sur un de mes sites, mais pas sur un autre ?

Certains réglages dans les blocs — « large » ou « pleine largeur » — doivent être pris en charge par votre thème. Bien que les mêmes blocs soient présents sur différents sites, les réglages spécifiques que vous pouvez appliquer à ces blocs peuvent être un peu différents en fonction de votre thème actif.

Haut ↑

Pourrai-je toujours utiliser l’ancien éditeur ?

Pour passer à l’éditeur classique, installez et activez l’extension Classic Editor sur votre site.

Haut ↑

Les codes courts fonctionnent-ils encore ?

Oui, l’éditeur est livré avec un bloc code court, que vous pouvez utiliser pour afficher des codes courts comme auparavant. À l’avenir, de nombreux codes courts deviendront des blocs.

Haut ↑

Cet éditeur est-il accessible ?

Notre objectif est que l’éditeur WordPress soit aussi accessible que les éditeurs précédents, sinon plus. Nous voulons que tout le monde soit en mesure de l’utiliser. Les normes de codage pour l’accessibilité de WordPress (en anglais) stipulent que « Tout nouveau code ou mise à jour publié dans WordPress doit être conforme aux directives WCAG 2.0 au niveau AA ». Ce ne sera pas une exception.

Haut ↑

Dois-je utiliser un thème particulier pour l’éditeur de blocs ?

Non. L‘éditeur de bloc fonctionne avec tous les thèmes. Cependant, seuls certains thèmes pourront prendre en charge des caractéristiques de mise en page spécifiques (comme le contenu « large » et « pleine largeur »). Quant aux thèmes basés sur des blocs ce sont des thèmes conçus à la fois pour l’éditeur de blocs et l’éditeur de site.

Traduit par Laurent MILLET
Relu par Jenny Dupuy & Sébastien SERRE
Dernière mise à jour le 2 avril 2024

Contribuer à la documentation en français de WordPress

Journal des modifications

2 avril 2024Jenny Dupuy – Refonte et mise en conformité avec la version 6.5.
05 mai 2021Jenny Dupuy – Suppression de l’encodage des caractères accentués ou spéciaux dans les liens concernés.
14 février 2021Patrice Pichon – Correction des liens déplacement des blocs et composition des blocs
14 février 2021Patrice Pichon – Ajout de Édition d’image en ligne et Raccourcis clavier dans l’Éditeur de blocs.
29 janvier 2021Patrice Pichon – Ajout du lien vers Colonne latérale des réglages de pages et articles
21 décembre 2020Patrice Pichon – Ajout de la version 5.5, l’espace de travail de l’éditeur de blocs, lien vers la page de répertoire de blocs
28 novembre 2020Patrice Pichon – Modification des liens : Voici les moyens d’ajouter un bloc, Éditeur Classique, Normes de codage pour l’accessibilité de WordPress (redirection de page).