Tutoriel : Comment modifier sa page ?

Pour commencer, ne paniquez pas ! Il n’y a rien de compliqué rassurez-vous ! Tout fonctionne par bloc et c’est intuitif !

Ce tutoriel est découpé en plusieurs parties, elles sont surlignées en jaune.

Allons-y !

Comment ajouter un bloc.

Le premier bloc de chaque page est le titre.

Ensuite, vous pouvez utiliser la souris pour vous déplacer sous le titre ou appuyer sur la touche tabulation de votre clavier pour vous déplacer vers le bas et commencer à écrire.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Ajouter un titre

Par défaut, le bloc suivant est un bloc de paragraphe. Cela permet aux utilisateurs de commencer à écrire tout de suite.

Cependant, si vous voulez ajouter quelque chose de différent, alors vous pouvez cliquer sur le bouton ajouter un nouveau bloc dans le coin supérieur gauche de l’éditeur, sous un bloc existant, ou sur le côté gauche d’un bloc.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Ajouter un nouveau bloc dans Gutenberg

Cliquez sur le bouton pour afficher le menu d’ajout de blocs avec une barre de recherche en haut et les blocs couramment utilisés en bas.

Vous pouvez cliquer sur les onglets pour parcourir les catégories de blocs ou taper le mot-clé pour rechercher rapidement un bloc.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Trouver et ajouter des blocs à Gutenberg

Si vous ne voulez pas utiliser une souris pour cliquer sur le bouton, vous pouvez utiliser un raccourci clavier en tapant / pour rechercher et ajouter un bloc.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress

Utilisation des blocs.

Chaque bloc est livré avec sa propre barre d’outils qui apparaît sur le dessus du bloc. Les boutons de la barre d’outils changent en fonction du bloc que vous éditez.

Par exemple, dans cette capture d’écran, nous travaillons dans un bloc de paragraphes qui montre des boutons de formatage de base tels que : alignement du texte, gras, italique, lien d’insertion, et boutons barrés.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Chaque bloc est livré avec sa propre barre d’outils

En plus de la barre d’outils, chaque bloc peut également avoir ses propres réglages de bloc qui apparaîtraient dans la colonne de droite de votre écran d’édition.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Réglages des blocs

Vous pouvez déplacer les blocs vers le haut et vers le bas par simple glisser-déposer ou en cliquant sur les boutons haut et bas à côté de chaque bloc.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Déplacement d’un bloc de haut en bas

Sauvegarde et réutilisation de blocs.

Optionnel – vous pouvez passer cette partie ou la consulter ici : ouvrir l’article

Ajouter une image.

Il y a un bloc image prêt à l’emploi dans l’éditeur. Il suffit d’ajouter le bloc, puis de télécharger un fichier image ou de le sélectionner dans la médiathèque.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Bloc image

Vous pouvez également glisser-déposer des images depuis votre ordinateur, et l’éditeur créera automatiquement un bloc d’images pour celui-ci.

Une fois que vous avez ajouté une image, vous pourrez voir les paramètres du bloc où vous pouvez ajouter des métadonnées pour l’image comme le texte alt, la taille, et ajouter un lien vers l’image.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Réglages du bloc image

Ajout d’un lien l’éditeur.

L’éditeur de blocs est livré avec plusieurs blocs dans lesquels vous pouvez ajouter du texte. Le plus communément utilisé est le bloc de paragraphe qui vient avec un bouton d’insertion de lien dans la barre d’outils.

Tous les autres blocs de texte couramment utilisés incluent également un bouton de lien dans la barre d’outils.

Vous pouvez également insérer un lien en utilisant le raccourci clavier, qui est Commande + K pour Mac et CTRL + K sur les ordinateurs Windows.

Ajout d’une galerie d’images.

Le bloc galerie fonctionne comme le bloc image. Vous l’ajoutez, puis vous téléchargez ou sélectionnez des fichiers image.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Ajout d’une galerie d’images dans le nouvel éditeur WordPress

Ajouter une image à côté d’un texte.

Vous pouvez le faire avec le bloc Media & Texte.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Bloc média et texte

Ce bloc simple est livré avec deux blocs placés côte à côte vous permettant d’ajouter facilement une image et d’ajouter du texte à côté de celle-ci.

Ajout d’un bouton dans les pages.

Vous avez accès un bloc de boutons qui vous permet d’ajouter rapidement un bouton à une page.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Ajout d’un bloc de boutons

Vous pouvez ajouter un lien pour votre bouton, changer les couleurs et choisir parmi trois styles de boutons.

Ajout de belles images de couverture.

Une autre fonctionnalité intéressante que vous pouvez essayer est le bloc ‘Bannière’, qui vous permet d’ajouter des images de couverture à vos pages.

Une bannière est une image plus large souvent utilisée comme couverture pour une nouvelle section d’une page. Elles sont magnifiques et vous permettent de créer des mises en page de contenu attrayantes.

Ajoutez simplement un bloc de bannière et téléchargez l’image que vous voulez utiliser. Vous pouvez choisir une couleur de surimpression pour la couverture ou en faire une image d’arrière-plan fixe pour créer un effet de parallaxe lorsque les utilisateurs font défiler la page.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Le bloc image bannière

Création de tableaux à l’intérieur d’articles

L’éditeur est livré avec un bloc Tableau par défaut, ce qui facilite grandement l’ajout de tableau dans vos pages. Ajoutez simplement le bloc, puis sélectionnez le nombre de colonnes et de lignes que vous voulez insérer.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Bloc de tableau

Vous pouvez maintenant commencer à ajouter des données aux lignes du tableau. Vous pouvez toujours ajouter des lignes et des colonnes supplémentaires si nécessaire. Il y a aussi deux options de style de base disponibles.

Création de contenu multi-colonnes

L’éditeur de blocs vous permet d’ajouter des blocs de colonnes, ce qui ajoute deux colonnes paragraphes.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Contenu de plusieurs colonnes

Ce bloc de colonnes est assez flexible. Vous pouvez ajouter jusqu’à 6 colonnes consécutives et même utiliser d’autres blocs dans chaque colonne.

Ajout de YouTube, Twitter, Facebook, Vimeo, Youtube et autres.

L’éditeur prévoit des blocs d’intégration dans l’éditeur de blocs. Il existe un bloc pour tous les types d’intégration pris en charge, y compris YouTube, Twitter, Facebook, et plus encore.

Comment utiliser Gutenberg, le nouvel éditeur de WordPress
Bloc de contenus embarqués

Cependant, vous pouvez simplement copier et coller l’URL d’intégration à n’importe quel moment, et cela créera automatiquement un bloc pour vous.

Par exemple, si vous avez ajouté une URL de vidéo YouTube, elle créera automatiquement un bloc YouTube et affichera la vidéo.

Le site est constante évolution, de nouvelles fonctionnalités apparaissent sans cesse !