Comment créer des zones de texte dans WordPress (3 types)

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 : Ajouter une zone de texte avec un arrière-plan coloré

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é.

Étape 1 : Sélectionnez un texte dans votre article/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é.

Sélectionnez un texte dans votre article/page pour créer un cadre autour de celui-ci.

Étape 2 : Ajouter une couleur à l'arrière-plan du bloc

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.

Ajouter une couleur à l'arrière-plan du bloc pour l'entourer d'un cadre

Vous pouvez ainsi créer une zone de texte avec un arrière-plan coloré.

Type 2 : Ajouter un texte avec des bordures

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.

Étape 1 : Sélectionner le texte dans l'éditeur

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.

Sélectionnez un bloc de paragraphe pour l'entourer d'une bordure

Étape 2 : Le convertir en bloc de terre

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.

Convertir le bloc Paragraphe en bloc Groupe

Étape 3 : Ajouter une bordure et un rayon au bloc

Aller à la page Onglet Styles du bloc sélectionné. Faites défiler l'onglet un peu plus bas.

Allez dans l'onglet Styles du bloc Groupe

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.

Ajoutez une bordure, un rayon et un remplissage au bloc Groupe pour créer une zone de texte.

Type 3 : Ajouter des zones de texte dans un tableau

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.

Ajoutez le bloc TableBerg à votre article ou à votre page

É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.

Créez des colonnes selon vos besoins

É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.

Ajouter du contenu au tableau

É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.

Coloriser les colonnes du tableau avec le plugin TableBerg

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.

Appliquer des couleurs différentes aux colonnes du tableau

É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.

Supprimer les bordures du tableau

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.



L'équipe Tableberg