L'éditeur Gutenberg est centré sur le "bloc", lorsque vous insérez du contenu tel que du texte, des images, etc., l'essentiel est d'ajouter un type de bloc correspondant et de le modifier. Cette approche est très flexible et permet un contrôle précis du style et de la position de chaque élément. Voici les étapes détaillées :
I. Insérer du texte : construire du contenu avec les blocs de paragraphes et de titres
Le texte est le corps principal de l'article, et Gutenberg réalise la mise en page du texte grâce aux blocs "Paragraphe" et "Titre", qui fonctionnent de la manière suivante :
1. insérer un paragraphe de texte (corps du texte)
- Méthode 1Lorsque vous entrez dans la page d'édition de l'article, l'invite "Commencez à écrire ou tapez / pour ajouter un bloc" s'affiche par défaut. Lorsque vous entrez le texte directement, le système crée automatiquement le bloc "Paragraphe".
- Méthode 2Cliquez sur l'icône "+" (inserteur de blocs) dans la zone d'édition, recherchez "paragraphe" et cliquez dessus pour générer un bloc de paragraphe vierge, puis saisissez le contenu.
mise en forme：
Sélectionnez un bloc de paragraphe et le panneau Bloc (Paramètres du bloc) s'affichera à droite pour le définir :
- Alignement (justifié à gauche, centré, justifié à droite, justifié aux extrémités) ;
- Taille du texte (petit, normal, grand, très grand) ;
- Couleur du texte (cliquer sur le carré de couleur pour choisir, en veillant à contraster avec la couleur de fond pour assurer la lisibilité) ;
- Couleur d'arrière-plan (pour ajouter une couleur de base aux paragraphes et mettre en évidence le contenu important).
2. l'insertion de titres (hiérarchie du contenu)
Le titre est utilisé pour distinguer la structure de l'article (par exemple, chapitre, section) et il est recommandé de l'utiliser selon la hiérarchie "H1-H6" (H1 est généralement le titre principal de l'article, qui a été placé par défaut en haut de la page d'édition, de sorte qu'il n'est pas nécessaire de l'ajouter à plusieurs reprises).
procédure：
- Cliquez sur l'icône "+" dans la zone d'édition, recherchez "Titre" et sélectionnez-le pour générer un cartouche.
- Saisissez le texte du titre (par exemple, "I. Préparation de l'installation").
- Sélectionnez le bloc et choisissez H2-H6 (H2 pour le sous-titre de niveau 1, H3 pour le sous-titre de niveau 2, et ainsi de suite) dans le "Niveau de titre" dans le panneau de droite.
finesseAprès avoir saisi le texte, sélectionnez-le et appuyez sur la touche Ctrl+B(en gras) ou Ctrl+I(italique) pour une mise en forme rapide du texte.
II. insertion d'images : utilisation du bloc "Images" pour ajouter des images et les optimiser
Les images donnent vie aux articles, et le bloc "Images" de Gutenberg permet de les télécharger, de les redimensionner et de les optimiser dans les étapes suivantes :
1. 3 façons d'insérer des images
- Méthode 1 : Télécharger une nouvelle imageCliquez sur l'icône "+" → Recherchez "Images" → Cliquez sur "Télécharger" → Sélectionnez un fichier image sur votre ordinateur → Attendez que le téléchargement soit terminé.
- Méthode 2 : Utilisation d'images de la médiathèqueSi une image a déjà été téléchargée (par exemple, une image déjà insérée), cliquez sur le bloc "Images" et sélectionnez "Médiathèque" → Cochez l'image cible → Cliquez sur "Sélectionner".
- Méthode 3 : Coller l'image directementCopiez l'image dans votre ordinateur (clic droit "Copier"), retournez dans la zone d'édition et cliquez avec le bouton droit "Coller", le système créera automatiquement le bloc d'image et le téléchargera.
2. l'ajustement des styles d'image (doit être optimisé)
Une fois le bloc d'images sélectionné, le panneau de droite vous permet de définir les paramètres clés suivants :
- alignement：
- Aligné à gauche / Aligné à droite : les images sont affichées sur le côté et le texte est affiché autour d'elles ;
- Alignement central : les images sont affichées au centre avec le texte au-dessus et au-dessous ;
- Alignement large : l'image occupe toute la largeur de la zone d'édition (convient aux images de grande taille).
- ampleurL'échelle est ajustée en faisant glisser le curseur "Largeur" (il est recommandé de ne pas décocher la case "Contrainte d'échelle" afin d'éviter toute distorsion de l'image).
- lienCliquez sur la case "Lien" pour relier l'image à d'autres pages (par exemple, cliquez sur l'image pour accéder à la page de l'image en haute résolution) ; si aucun lien n'est nécessaire, la case peut être laissée vide.
- Texte alternatif (Alt Text)Description de l'image : Entrez une description de l'image (par exemple "Capture d'écran des étapes d'installation de WordPress") pour aider les moteurs de recherche à reconnaître le contenu de l'image, à améliorer le référencement et à faciliter l'accessibilité.
3. la résolution des problèmes courants
- Échec du téléchargement des images : vérifiez la taille de l'image (il est recommandé de ne pas dépasser 5 Mo), son format (JPG, PNG, WebP), ou actualisez la page et réessayez.
- Images floues : veillez à télécharger l'image originale (résolution d'au moins 1000 px de large) et évitez de zoomer au-delà de la taille originale.
Insérer une vidéo : ajouter une vidéo locale ou en ligne avec le bloc "Vidéo".
Qu'il s'agisse d'une vidéo que vous avez tournée vous-même ou d'une vidéo provenant de YouTube, Station B ou d'autres plateformes, vous pouvez l'insérer dans le bloc "Vidéo" :
1. insérer une vidéo locale (que vous avez vous-même téléchargée)
- Cliquez sur l'icône "+" → recherchez "Vidéo" → sélectionnez "Télécharger" → sélectionnez le fichier vidéo dans votre ordinateur (les formats MP4, WebM sont pris en charge).
- Une fois le téléchargement terminé, la vidéo s'affiche automatiquement dans le bloc et peut être testée en cliquant sur lecture.
prendre noteLes fichiers vidéo locaux sont volumineux et peuvent occuper de l'espace sur le serveur et ralentir la vitesse de chargement. Il est recommandé d'utiliser cette méthode uniquement pour les petites vidéos (moins de 100 Mo) et de donner la priorité aux plateformes en ligne pour les vidéos volumineuses.
2. insérer une vidéo en ligne (recommandé !)
Inséré via un lien de plateforme vidéo, il n'occupe pas d'espace serveur et se charge plus rapidement :
- Ouvrez la plateforme vidéo (par exemple YouTube, B Station, Tencent Video), recherchez la vidéo cible et copiez le lien de partage (par exemple
https://www.bilibili.com/video/BV123456）。 - Dans la zone d'édition Gutenberg, collez directement le lien → le système reconnaîtra et créera automatiquement le bloc vidéo et affichera le lecteur vidéo.
Plates-formes prises en chargeVous pouvez utiliser YouTube, B-Site, Tencent Video, Youku, Aqiyi et d'autres plateformes grand public, et attendre 2 à 3 secondes pour que le lien se charge après l'avoir collé.
3. réglage du style vidéo
Sélectionnez le bloc vidéo et le panneau de droite peut être défini :
- Alignement (identique à l'image, l'alignement gauche/droite permet au texte de s'enrouler autour) ;
- Largeur (redimensionner le lecteur vidéo, il est recommandé de ne pas dépasser 1000px de largeur pour éviter un affichage incomplet sur les téléphones mobiles) ;
- Autoplay : non recommandé (la plupart des navigateurs bloquent l'autoplay, ce qui affecte l'expérience).
Quatrièmement, insérer des liens : faire en sorte que le texte, les images soient associés à d'autres contenus
Les liens sont les "vaisseaux sanguins" d'un site web, qui peuvent associer le contenu à d'autres pages et à des sites web externes, et Gutenberg permet d'ajouter des liens au texte et aux images :
1. ajouter des liens au texte (hyperliens)
- Sélectionnez le texte auquel vous souhaitez ajouter un lien (par exemple, "Cliquez pour un tutoriel détaillé").
- Cliquez sur l'icône "Lien" (forme de chaîne) dans la barre d'outils qui apparaît ci-dessus, ou appuyez sur la touche de raccourci
Ctrl+K。 - Collez l'adresse du lien (par exemple un lien vers une page du site) dans le champ de saisie.
https://你的域名/教程ou des liens externeshttps://example.com）。 - Paramètres optionnels :
- Cochez "Ouvrir dans un nouvel onglet" (les liens externes sont recommandés pour éviter que les visiteurs ne quittent votre site) ;
- Cliquez sur l'icône "Paramètres du lien" (petite roue dentée) pour ajouter un titre au lien (texte affiché au passage de la souris).
- Cliquez sur "Enter" ou "Apply" pour terminer le réglage. Le texte devient bleu et souligné, ce qui indique que le lien a été ajouté avec succès.
2. ajouter des liens aux images
- Sélectionnez le bloc d'image et trouvez la boîte de saisie "Lien" dans le panneau de droite.
- Saisissez l'adresse du lien (par exemple, cliquez sur l'image pour accéder à la page détaillée du produit).
- Cochez la case "Ouvrir dans un nouvel onglet" (si vous le souhaitez) et cliquez sur l'espace vide pour enregistrer.
3. suppression des liens
- Lien de texte : Sélectionnez le texte avec le lien, cliquez sur l'icône "Supprimer le lien" (chaîne avec une croix) dans la barre d'outils, ou appuyez sur la touche
Ctrl+KSupprimer ensuite l'adresse du lien. - Lien vers l'image : Sélectionnez l'image et supprimez l'adresse dans la zone de saisie "Lien" sur le côté droit.
V. Conseils pour les opérateurs novices
- Raccourcis des opérations en bloc：
- Ajouter rapidement un bloc : entrer
/+ nom du bloc (par exemple/图片(Faire apparaître directement le bloc d'images) ; - Déplacer le bloc : sélectionnez le bloc et appuyez sur
↑/↓ou faites glisser l'icône "⋮⋮" à gauche du bloc ; - Supprimer le bloc : sélectionnez le bloc et appuyez sur
Deleteou cliquez sur l'icône "Supprimer" dans la barre d'outils du bloc.
- Ajouter rapidement un bloc : entrer
- Aperçu en temps réelCliquez sur le bouton "Aperçu" dans le coin supérieur droit de la page d'édition pour vérifier si le lien fonctionne et si l'image ou la vidéo s'affiche correctement.
- Éviter la typographie excessiveLa couleur du texte et la couleur d'arrière-plan ne doivent pas être trop nombreuses (pas plus de 3), afin que la page soit bien ordonnée ; la taille des images et des vidéos est uniforme (par exemple, la largeur est fixée à 800 px), afin d'améliorer l'esthétique.
Avec les étapes ci-dessus, vous pouvez facilement insérer et modifier du texte, des images, des vidéos et des liens dans l'éditeur Gutenberg. N'oubliez pas : chaque élément est un "bloc" distinct, sélectionnez-le et ajustez les paramètres dans le panneau de droite pour une mise en page précise. Entraînez-vous encore quelques fois et vous aurez bientôt le coup de main !
Français