Comment utiliser Gutenberg sur Wordpress ?

Procédure

Qu'est ce que Gutenberg ?

Vous avez tous très certainement entendu parler de Gutenberg sur Wordpress. A partir de la version 5 de Wordpress, il ne sera plus nécessaire de télécharger et d'activer ce module, en effet, il sera automatiquement intégré à toutes les nouvelles installations de ce CMS.

Gutenberg, même si ce plugin n'est pas similaire à un Page Builder, son fonctionnement reste similaire. En effet, il fonctionne de la même manière, grâce à l'utilisation de blocs permettant l'ajout de contenus. On peut y insérer différents types de contenus tels que textes, vidéos et images. Il vous est possible de déplacer les blocs par simple glisser-déposer de ces derniers.

Comment fonctionne Gutenberg sur Wordpress ?

Lors de l'ajout d'une nouvelle page ou d'un nouvel article, vous avez la possibilité de choisir d'utiliser "Gutenberg" ou votre "Editeur classique".

Ce tutoriel va s'intéresser à Gutenberg. De ce fait, une nouvelle page va être créée. Lors de la création d'une nouvelle page, nous arrivons directement sur la nouvelle interface de création.

En haut à gauche de votre interface, vous pouvez trouver les boutons suivants:

• Le bouton "+": Permet d'ajouter un nouveau bloc
• Les flèches (droite ou gauche) permettent d'annuler ou de rétablir une actions
• Le (i) permet de donner plus d'informations concernant votre article tel le nombre de mots, de titre, de paragraphes et de blocs.

En haut à droite de votre interface, vous pouvez trouver les boutons suivants:

• Prévisualiser: permet d'avoir un aperçu de votre article et/ou page
• Publier: permet la mise en ligne de votre article ou page
• Le bouton représentant un engrenage permet de masquer votre barre latérale.
• Les trois petits points permettent d'avoir accès à diverses options supplémentaires tel qu'un aperçu du code HTML 

Dans la barre latérale, vous avez disposé de deux options, Document et bloc.

• Document: il s'agit des réglages liés à votre publication tel que la visibilité, l'image d'entête et les étiquettes
• Blog: Permet d'effectuer des réglages sur un bloc que vous aurez sélectionné. Chaque bloque de contenus (Texte, Paragraphes, titre, image) dispose de ses propres options.

Quel sont les différents blocs de contenus sur Gutenberg ?

GUtenberg dispose de différents types de blocs de contenus. Afin d'ajouter des blocs, il vous suffit de cliquer sur le petit "+" se trouvant en haut à gauche de votre page. Par défaut, chaque nouveau bloc est ajouté en bas de page. Il existe 5 groupes de blocs qui sont les suivants:

• Communs: Ce sont les blocs de bases (Titres, paragraphes, images)
• Formattage: Il s'agit des formats dans lesquelles vous allez pouvoir rédiger vos différents contenus (Classique, HTML, Code source, texte préformatté).
• Mise en page: Ces blocs vont vous permettre de soigner la mise en page de votre article en utilsiant des séparateurs, colonnes, boutons par exemple.
• Widget: Vous pouvez désormais intégrer dans votre article le widget de votre choix
• Embed: Ce sont des contenus d'autres plateforme tel que Youtube, Twitter.

Comment ajouter un bloc à votre page ?

1. Cliquez sur l'onglet "+" se trouvant en haut à gauche puis sur "Titre".

2. Lors de l'ajout du bloc titre comme d'un autre bloc, vous aurez la possibilité d'avoir accès à des options suplémentaires en cliquant sur les trois petits points. Il vous est possible de dupliquer votre titre, le déplacer, en modifier le code HTML et/ou supprimer le bloc.

Il vous est possible d'effectuer les même actions pour tous les autres blocs. Chaque bloc dispose de ses propres options.

Conclusion

Vous êtes désormais en meusre d'utiliser Gutenberg afin de créer les différentes pages et articles de votre site Wordpress sur votre hébergement LWS. L'éditeur classique de Wordpress se faisait vieillissant. Il s'agit de ce fait, d'une avancée majeure pour ce logiciel.

N'hésitez pas à partager vos questions et remarques !