Éditer du contenu WordPress – Éditeur 2/3

Edition de contenus
Photo by Marco Djallo on Unsplash

Apprenez à utiliser la zone de contenu de l’éditeur de contenu WordPress Gutenberg, pour éditer du contenu WordPress. Cette documentation est la suite de Comment modifier les pages sur WordPress – Éditeur 1/3

Qu’est-ce que la zone de contenu des pages

Pour éditer du contenu WordPress, le contenu est ajouté à vos pages dans la zone de contenu.

Exemple d'une zone de contenu de l'éditeur Gutenberg

La zone de contenu est la même pour les publications.

Zone de contenu de l'éditeur d'une publication

Et les pages.

Zone de contenu de l'éditeur d'une page

La seule différence entre l’éditeur de contenu d’une Publication et d’une Page sont les fonctionnalités trouvées dans la section Paramètres.

Différences de la section paramètres entre une page et une publication

Travailler avec des blocs pour éditer du contenu WordPress

Lorsque vous créez une nouvelle publication ou une nouvelle page dans WordPress, votre zone de contenu sera vide, à l’exception de la page ou publication zone Titre et un espace réservé Bloc.

La page d'édition vide pour une page

La zone Titre est un bloc obligatoire.

Le champ du titre pour éditer une page wordpress

Cliquez à l’intérieur du champ et tapez ou collez le titre de votre page.

Exemple de remplissage d'un champ du titre pour une page

Après la publication, vous serez en mesure d’afficher et de modifier le titre de votre page et de modifier le permalien de votre page.

Affichage du permalien de la page après publication

Tout ce que vous créez pour votre page dans les zones de contenu est fait en utilisant des « blocs ».

Astuce :
Si vous souhaitez commencer par autre chose que du texte lors de la création d’une page (par exemple une image ou une citation), commencez par sélectionner un nouveau bloc.

Exemples des ajouts de blocs possibles rapidement

Si vous commencez une nouvelle page en tapant du texte dans le champ espace réservé, WordPress convertira automatiquement la zone en bloc de paragraphe.

Un bloc paragraphe ajouté automatiquement poru n'importe quel texte tapé

Appuyez sur la touche Entrée à l’intérieur d’un bloc de paragraphe crée un nouveau bloc de paragraphe.

Ajouter un nouveau bloc paragraphe avec la touche entrée

(Appuyez sur Entrée lors de la saisie pour créer un nouveau bloc de paragraphe)

Pour éditer du contenu WordPress, vous pouvez modifier tout et n’importe quoi à tout moment sur votre page. Pour cela, vous pourrez ajouter ou modifier des blocs, modifier le contenu à l’intérieur de ces blocs et configurer les paramètres de bloc.

Ajouter un bloc pour éditer du contenu WordPress

Cliquez sur l’outil Ajouter un bloc (+) pour afficher une liste de tous les blocs disponibles que vous pouvez utiliser pour éditer du contenu WordPress.

Menu pour ajouter un bloc parmi tous ceux disponible sur le site web

L’outil Ajouter un bloc contient un champ Rechercher et plusieurs sections de menu :

  • Les plus utilisés
  • Blocs communs
  • Mise en forme
  • Mise en page
  • Widgets
  • Intégration

Pour en savoir plus sur les widgets, parcourez cette documentation !

Après avoir cliqué dans l’outil Ajouter un bloc, sélectionnez (ou recherchez et sélectionnez) un bloc dans l’une des sections du menu Ajouter un bloc.

Exemple de selection d'un bloc Liste

Le bloc que vous avez sélectionné sera inséré là où votre le curseur est positionné dans la zone de contenu (ou sous votre contenu existant si votre curseur n’est pas à l’intérieur de la zone de contenu).

Le bloc Liste est bien ajouté sur la page

Vous pouvez réorganiser ou repositionner les blocs en utilisant les flèches déplacer vers le haut ou déplacer vers le bas.

Bouton pour déplacer vers le haut le bloc

Vous pouvez également placer le bloc où vous le souhaitez en faisant glisser et déposer des blocs pour réorganiser la mise en page de votre contenu.

Déplacer le bloc par un glisser-déposer
Exemple de déplacement par glisser déposer

Éditeur de blocs

En fonction du type de bloc ajouté à votre page, les blocs auront leur votre propre éditeur de blocs avec divers paramètres et options que vous pouvez configurer pour personnaliser ou formater davantage le contenu du bloc. Par exemple, vous trouverez ci-dessous une capture d’écran de l’éditeur de blocs d’un bloc de paragraphe.

Menu de l'éditeur de blocs

Plus d’options pour l’éditeur de blocs

Chaque type de bloc a ses propres paramètres et options.

Un élément courant des éditeurs de blocs est la section Plus d’options, qui comprend les paramètres standard suivants :

  • Masquer les paramètres de bloc
  • Dupliquer
  • Insertion avant
  • Insertion après
  • Modification au format HTML
  • Ajouter aux blocs réutilisables
  • Supprimer le bloc
Menu 'Plus d'options' pour l'éditeur de blocs

Si vous souhaitez modifier votre contenu en HTML, visitez notre documentation pour connaitre Les balises HTML utiles pour WordPress !

Masquer les paramètres de bloc

Le masquage des paramètres de bloc vous permet d’éditer du contenu WordPress sans aucune distraction (c’est-à-dire le mode « sans distraction »). Pour masquer les paramètres de bloc :

  • Cliquez n’importe où dans le bloc pour afficher l’éditeur de blocs.
  • Sélectionnez le menu Plus d’options
  • Cliquez sur Masquer les paramètres de blocage pour masquer la barre latérale Paramètres.
  • Cliquez sur Afficher les paramètres de blocage pour afficher à nouveau la barre latérale Paramètres dans votre éditeur de contenu.
Exemple pour masquer les paramètres de blocs

Dupliquer

Ce paramètre vous permet de créer et d’ajouter un élément identique (c’est-à-dire un clone) à tout bloc sélectionné dans votre contenu. Pour dupliquer un bloc :

  • Cliquez n’importe où dans le bloc pour afficher l’éditeur de blocs.
  • Sélectionnez le menu Plus d’options.
  • Cliquez sur Dupliquer.
  • Modifiez et/ou repositionnez le bloc dupliqué si nécessaire.
  • Enregistrez votre publication ou votre page pour mettre à jour votre contenu.
Exemple pour dupliquer un bloc

Insérer avant

Ce paramètre vous permet d’insérer un nouveau bloc dans votre contenu au-dessus du bloc sur lequel vous travaillez actuellement. Pour insérer un bloc au-dessus du bloc sélectionné :

  • Sélectionnez le bloc dans lequel un nouveau bloc sera inséré avant lui.
  • Cliquez n’importe où dans le bloc pour afficher l’éditeur de blocs.
  • Sélectionnez le menu Plus d’options.
  • Cliquez sur Insérer avant.
  • Un nouveau bloc espace réservé sera inséré au-dessus du bloc sélectionné.
  • Utilisez l’outil Ajouter un bloc pour sélectionner le type de bloc que vous souhaitez ajouter au nouvel espace réservé de bloc.
  • Enregistrez votre publication ou votre page pour mettre à jour votre contenu.
Exemple pour insérer un bloc avant celui selectionné

Insérer après

Ce paramètre vous permet d’insérer un nouveau bloc dans votre contenu sous le bloc sur lequel vous travaillez actuellement. Pour insérer un bloc sous votre bloc sélectionné :

  • Sélectionnez le bloc dans lequel un nouveau bloc sera inséré après lui.
  • Cliquez n’importe où dans le bloc pour afficher l’éditeur de blocs.
  • Sélectionnez le menu Plus d’options.
  • Cliquez sur Insérer après.
  • Un nouveau bloc espace réservé sera inséré sous votre bloc sélectionné.
  • Utilisez l’outil Ajouter un bloc pour sélectionner le type de bloc que vous souhaitez ajouter au nouvel espace réservé de bloc.
  • Enregistrez votre publication ou votre page pour mettre à jour votre contenu.
Exemple pour insérer un bloc après celui selectionné

Modifier au format HTML

Normalement, vous affichez, modifiez et formatez votre contenu à l’aide d’un éditeur visuel. Ce paramètre vous permet d’afficher et de modifier le code du bloc HTML. Pour afficher et modifier le code HTML du bloc :

  • Cliquez n’importe où dans le bloc pour afficher l’éditeur de blocs.
  • Sélectionnez le menu Plus d’options.
  • Cliquez sur Modifier au format HTML.
  • Le contenu du bloc basculera vers l’éditeur HTML.
  • Pour revenir à l’éditeur visuel, sélectionnez à nouveau le menu Plus d’options et cliquez sur Modifier visuellement.
  • Enregistrez votre publication ou votre page pour mettre à jour votre contenu.
Exemple pour modifier un bloc au format HTML

Ajouter aux blocs réutilisables

Ce paramètre vous permet de stocker un bloc personnalisé qui peut être réutilisé n’importe où sur votre site. Pour enregistrer votre bloc réutilisable :

  • Cliquez n’importe où dans le bloc pour afficher l’éditeur de blocs.
  • Sélectionnez le menu Plus d’options.
  • Cliquez sur Ajouter aux blocs réutilisables.
  • Votre bloc sera stocké dans la bibliothèque de blocs réutilisables de WordPress.
Exemple d'ajout d'un bloc à la bibliothèque de blocs réutilisables

Supprimer le bloc

Ce paramètre vous permet de supprimer un bloc d’une publication ou d’une page et de supprimer le contenu dont vous n’avez plus besoin. Pour supprimer un bloc de votre publication ou page :

  • Sélectionnez le bloc que vous souhaitez supprimer.
  • Cliquez n’importe où dans le bloc pour afficher l’éditeur de blocs.
  • Sélectionnez le menu Plus d’options.
  • Cliquez sur Supprimer le bloc.
  • Votre blocage sera supprimé de votre publication ou de votre page.
  • Enregistrez votre publication ou votre page pour mettre à jour votre contenu.
Exemple de suppression d'un bloc

Pour masquer le menu Plus d’options, cliquez sur l’icône du menu.

Masquer le menu 'Plus d'options'

L’aspect de votre contenu après la publication dépend :

  • D’abord du thème WordPress que vous utilisez (et ses règles de style CSS)
  • Ensuite des paramètres de bloc, d’options et de configurations.
  • Puis des plugins supplémentaires que vous avez installés sur votre site.
  • Enfin des intégrations avec d’autres applications,

Si les thèmes et les plugins WordPress ne sont pas des concepts clairs pour vous, rendez-vous sur notre documentation dédiée à ce sujet !

Tous les Blocs par catégorie

La section ci-dessous répertorie les blocs WordPress Gutenberg par catégorie que vous pourrez utiliser pour éditer du contenu WordPress.

Blocs communs

AUDIO : Le bloc Audio vous permet d’ajouter vos fichiers audio à WordPress via un lecteur audio simple.

COUVERTURE : Le bloc Cover vous permet d’ajouter une couverture d’image ou vidéo avec une superposition de texte à WordPress.

FICHIER : Le bloc de Fichiers  vous laisse ajouter un lien vers un fichier téléchargeable.

GALERIE : Le bloc Galerie vous permet d’afficher plusieurs images dans une riche galerie

TITRES

IMAGE

LISTE

PARAGRAPHE 

CITATION : Le bloc de Citation vous permet d’ajouter une emphase visuelle à votre contenu avec du texte cité.

VIDÉO : Le bloc Vidéo vous permet de télécharger et d’intégrer une vidéo sur votre site à partir de votre médiathèque ou d’une URL externe.

Formatage / Mise en forme

CLASSIC : Le Bloc Classique vous permet d’ajouter du contenu à vos publications et pages à l’aide de l’éditeur classique de WordPress.

CODE : Utilisez le bloc de Code pour afficher le code et des extraits de code sur votre site qui respectent votre mise en page, sans être interprété.

CUSTOM HTML : Le bloc HTML personnalisé vous permet ajoutez du code HTML personnalisé à votre site WordPress et prévisualisez-le au fur et à mesure que vous le modifiez.

Préformaté : Le bloc Préformaté vous permet d’ajouter du texte avec espacement, tabulations et style.

PULLQUOTE : Le bloc Pullquote vous permet de mettre en valeur les citations de texte avec des couleurs et des styles.

VERSE : Le bloc de Vers vous permet d’ajouter des poèmes, des vers, des paroles de chansons…

Mise en page

BUTTON : Le bloc de Bouton vous permet d’ajouter un bouton personnalisé pour inviter les utilisateurs et les visiteurs à effectuer l’action souhaitée.

COLONNES : Utilisez le bloc Colonnes pour ajouter des colonnes à WordPress et insérer du contenu textuel dans vos colonnes.

MEDIA & TEXTE : Le bloc Médias et texte vous permet de définir côte à côte les médias et le texte pour une mise en page de contenu plus riche.

PLUS : Le bloc Plus vous permet de définir un extrait ou un teaser pour votre contenu avec un lien sur lequel les utilisateurs peuvent cliquer.

SAUT DE PAGE : Le bloc Saut de page vous permet de diviser votre contenu en sections plus petites avec plusieurs pages.

SÉPARATEUR : Le bloc Séparateur vous permet de casser votre contenu sections avec un séparateur horizontal.

ESPACEMENT : Le bloc d’Espacement vous permet d’ajouter un espace blanc entre les blocs et de personnaliser sa hauteur.

TABLE : Le bloc de Tableau vous permet d’ajouter un tableau à WordPress avec des colonnes et des lignes pour afficher les données sous forme de tableau.

Widgets

ARCHIVES : Le bloc Archives vous permet d’insérer un widget Archives dans votre contenu pour afficher une archive mensuelle de vos publications.

CATÉGORIES : Le bloc Catégories affiche une liste de toutes vos catégories.

DERNIERS COMMENTAIRES : Le bloc des Derniers commentaires affiche une liste des commentaires les plus récents de votre site.

DERNIÈRES PUBLICATIONS : Le bloc des Dernières publications affiche une liste des dernières publications de votre site.

SHORTCODE : Le bloc Shortcode vous permet d’insérer des éléments personnalisés dans WordPress à l’aide de shortcodes.

Blocs d’intégration

INTEGRE : Le bloc Embed vous permet d’intégrer des vidéos, des images, des tweets, audio et autres contenus provenant de sources externes.

RÉUTILISABLES : Apprenez à créer et utiliser des Blocs réutilisables pour l’éditeur de contenu WordPress Gutenberg.

Wow ! Vous êtes aux 2/3 de cette série de guides sur l’éditeur Gutenberg. C’est presque la fin 😉

Chargement