Par où commencer avec Gutenberg ?

Vous pouvez tester par vous même directement cette nouvelle expérience d’édition de contenu via https://fr.wordpress.org/gutenberg/ mais si vous êtes plus terre à terre, alors nous allons parcourir ensemble chacune des fonctionnalités de ce nouvel éditeur.

En place depuis la version 5.0 de WordPress, Gutenberg apporte une nouvelle façon de penser son contenu, bye bye l’éditeur classique que tous le monde connaissait. Il en demeure pas moins pour les frileux du changement, vous pouvez désactiver à tout moment Gutenberg.

Bref, découvrons ensemble cet éditeur.

Premiers pas avec le nouvel éditeur de WordPress

Il faut savoir qu’en réalité Gutenberg existait déjà (et toujours) sous forme de plugin. Vous l’avez compris il était donc possible de s’exercer à cette nouvelle manière de rédiger avant sa sortie officielle. Chez Fantassin on a fait le choix de l’adopter depuis juillet 2018 sur nos projets.

Cette nouvelle façon de penser vos contenus s’appelle les blocs. Regardez par vous-même en images :

Chaque élément de votre page est un bloc, et si on l’applique un peu plus loin on peut même faire des blocs de blocs. Par exemple, le bloc « Colonnes » donne la possibilité d’insérer n’importe quels éléments à l’intérieur. C’est précisément là où Gutenberg vient concurrencer les pages builder.

Cette philosophie était déjà présente dans WordPress sous forme de shortcode. N’importe qui un temps soit peu bidouilleur pouvait créer son propre shortcode et l’ajouter dans l’éditeur classique pour enrichir son contenu.

Les contributeurs de WordPress en ont fait leur chantier en 2017 pour créer ce nouvel éditeur, nom de code : Gutenberg.

Découvrir l’interface de Gutenberg

Commençons d’abord par appréhender l’interface de l’éditeur.

La barre d’outils

La partie haute de l’écran peut s’assimiler à une barre d’outils elle recense toutes les actions possibles au sein d’une page.

Barre d’outils de Gutenberg

Sur la gauche on y retrouve de quoi :

  • Ajouter un bloc ;
  • Annuler une action ;
  • Rétablir une action ;
  • Voir la structure de notre contenu :
  • Aller à un bloc en particulier.

Et sur la droite :

  • Enregistrer en brouillon, sauvegarde notre travail sans le publier ;
  • Prévisualiser, permet d’avoir un aperçu de la mise en page de notre contenu ;
  • Mettre à jour, enregistre les modifications que l’on a apporté à notre document ;
  • Réglages, affiche/cache la partie droite de l’écran ;
  • Les trois petits points verticaux, permet d’activer plus d’options

Les réglages de l’éditeur

L’onglet Document regroupe toutes les options applicable à la page en cours de construction, vous pouvez par exemple :

  • Rétablir un contenu plus ancien ;
  • Changer le nom qui apparaît dans l’URL ;
  • Mettre une image à la une.

C’est ici aussi que vous pourrez activer ou désactiver les commentaires sur la page.

Il est possible que cette zone change en fonction des types de contenu que vous éditez.

Si vous êtes dans la partie « Articles » de WordPress vous verrez apparaitre un onglet supplémentaire pour choisir la catégorie dans laquelle placer l’article en cours de rédaction.

Réglages de la page

L’onglet Bloc permet lorsqu’on a sélectionné un élément d’accéder à ses paramètres.

Par exemple, vous voyez qu’avec le bloc paragraphe, il est possible de jouer sur la taille de police ou bien encore la couleur de l’arrière-plan et du texte.

Chaque bloc apporte son lot d’options, cela va de soi. Vous retrouverez le détail de chaque bloc sur la page suivante :

Réglages du bloc paragraphe