Aller au contenu principal

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.

Gutenberg : 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, en violet).
  • La colonne latérale des réglages de la publication et des blocs (à droite de l’écran, en bleu).
  • La zone centrale d’édition de contenu (au centre de l’écran, en jaune).

L’interface peut aussi proposer la Vue en liste (à gauche de l’écran, en vert) et en bas de la fenêtre, le fil d’Ariane (en bas de l’écran, en rouge) 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.

La barre d’outils supérieure​

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

  • Voir les articles / La barre d’outils supérieure (1) – 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 (2) – 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 (3) – 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 (4 et 5) – 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 (6) – 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 (7) – 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 (8) – 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 (9) – 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 (10) – 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 (11) – Cet outil permet d’accéder aux options de l’éditeur.

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 (12) et Bloc (13) ; 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.

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 (14) 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.

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 blocs décrit plus précisément cette partie de l’interface de l’éditeur.

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.

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.

Articles complémentaires​

Référence​

La documentation Gutenberg reprend les informations du site fr.wordpress.org accessible en français ci-dessous :

L’éditeur de blocs WordPress