Une zone de texte est une zone désignée dans l'éditeur Gutenberg où vous pouvez créer et publier des textes avec différentes options de typographie, de police, de couleur, de stylisation et d'autres options de formatage.
Lorsque vous souhaitez mettre en avant une annonce importante, un témoignage ou une brève description de produit, les zones de texte vous permettent de le faire. Dans cet article, nous allons vous montrer plusieurs façons de créer des zones de texte dans WordPress.
Type 1: Add a Text Box With a Colored Background
Il s'agit d'une procédure simple et directe. Il suffit d'ajouter une couleur à l'arrière-plan du bloc de paragraphe concerné.
Step 1: Select a Text on Your Post/Page
Ouvrez l'article/la page où vous souhaitez ajouter la zone de texte. Sélectionnez le texte de votre choix en plaçant votre curseur sur le paragraphe concerné.
Step 2: Add a Color to the Background of the Block
Aller à la page Onglet Styles, comme indiqué dans l'image ci-dessous. Cliquez sur le bouton Option d'arrière-plan et sélectionnez une couleur. La couleur sera instantanément appliquée au bloc que vous pouvez voir en temps réel.
Une fois la couleur appliquée autour et à l'intérieur du bloc entier, il semblera qu'une boîte a été créée autour du bloc, créant ainsi une zone de texte.
Vous pouvez ainsi créer une zone de texte avec un arrière-plan coloré.
Type 2: Add a Text with Borders
L'ajout de bordures autour du bloc est une autre façon simple de créer une zone de texte. Suivez les étapes expliquées ci-dessous.
Step 1: Select the Text on the Editor
Sélectionnez à nouveau un texte en cliquant sur le bloc de paragraphe souhaité, comme nous vous l'avons montré dans la méthode ci-dessus.
Step 2: Convert It into the Ground Block
Par défaut, le bloc paragraphe ne permet pas d'ajouter une bordure autour de lui. Il faut donc le convertir en Bloc de groupe.
Cliquez sur le bouton Icône de paragraphe dans la barre d'outils Gutenberg. Une liste apparaît avec l'option Groupe à la fin. Cliquez sur l'option Option de groupe sur la liste.
Le bloc sera converti en bloc du groupe.
Step 3: Add Border and Radius to the Block
Aller à la page Onglet Styles du bloc sélectionné. Faites défiler l'onglet un peu plus bas.
Vous verrez le Option de bordure. Placez une valeur en pixels pour définir la largeur de la bordure. Vous pouvez également ajouter un rayon et un rembourrage au bloc si vous le souhaitez.
Votre zone de texte est donc prête. L'ajout d'un rayon et d'un remplissage peut rendre la zone de texte plus présentable. Vous pouvez donc envisager de les ajouter.
Type 3: Add Text Boxes in Table
Il peut arriver que vous souhaitiez créer plusieurs zones de texte dans la même ligne. Mais ce n'est pas possible avec le bloc de paragraphes par défaut. Cependant, vous pouvez le faire facilement en créant un tableau.
Tableberg est un plugin de construction de tableaux qui permet de le faire. Installer et activer le plugin et suivez les étapes indiquées ci-dessous.
Étape 01 : Ajouter le bloc TableBerg à votre site
Il suffit de trouver le Bloc TableBerg dans la bibliothèque de blocs de Gutenberg et ajoutez-la à votre éditeur de pages ou de posts.
Étape 02 : Créer les colonnes nécessaires
Comme la table par défaut de Gutenberg, créer autant de colonnes que nécessaire sur la table.
Étape 03 : Ajouter du contenu aux colonnes du tableau
Bien que TableBerg permette d'ajouter des listes, des boutons CTA et des images au tableau, nous n'avons ajouté que du texte simple pour expliquer le tutoriel.
Étape 04 : Ajouter des couleurs aux colonnes du tableau
Sélectionner une colonne sur la table en plaçant votre curseur dessus. Accédez à la page Onglet Styles. Cliquez sur le bouton Option d'arrière-plan et sélectionnez une couleur. Vous verrez que la couleur a été appliquée à la colonne.
En suivant la même méthode, appliquez différents types de couleurs aux autres colonnes du tableau. Vous pouvez voir que nous avons appliqué quatre couleurs différentes aux colonnes du tableau.
Vos zones de texte sont donc prêtes. Mais si vous souhaitez supprimer la bordure du tableau, suivez l'étape suivante.
Étape 05 : Retirer la bordure du tableau
Sélectionnez l'ensemble du tableau en cliquant deux fois sur l'icône TableBerg dans la barre d'outils. Accédez à l'onglet Onglet Styles sur la barre latérale droite. Descendez un peu. Désactivez l'option Activer la bordure intérieure. Les bordures du tableau seront invisibles.
Conclusion
Ainsi, vous pouvez créer des zones de texte dans WordPress de différentes manières. Mais avant de conclure, nous voulons dire une chose : chacune de ces méthodes peut ne pas être efficace dans tous les cas.
En fonction de votre type de contenu, vous devez utiliser une méthode appropriée qui préserve la lisibilité. Si vous avez aimé cet article, faites-nous part de vos réactions dans la boîte de commentaires ci-dessous.
Découvrez nos archives du blog pour découvrir d'autres articles intéressants sur WordPress.
