Configurer l'éditeur de texte enrichi
En tant que développeur, il arrive que les éditeurs WYSIWYG fournissent des fonctionnalités qui, lorsqu'elles sont mal utilisées, peuvent entraver l'objectif d'une marque unifiée et causer des problèmes de conception et de flux de contenu. L'éditeur de texte enrichi à l'intérieur des modules personnalisés permet désormais aux développeurs de supprimer des composants de la barre d'outils de configuration via la propriété enabled_features
à l'intérieur du fichier fields.json.
Remarque : Ce qui suit s'applique aux modules personnalisés utilisant le champ de texte enrichi en développement local uniquement. L'utilisation de cette fonctionnalité ne désactivera pas la fonctionnalité des options supprimées de l'éditeur de texte enrichi, uniquement l'affichage des options. Cela s'explique par des raisons de rétrocompatibilité, de sorte que le contenu existant n'est pas affecté.
Dans votre fichier fields.json où vous avez votre objet de champ de texte enrichi, vous pouvez activer certaines fonctionnalités en ajoutant les options valides de la barre d'outils dans un tableau à la propriété enabled_features
, comme indiqué ci-dessous :
// Rich text field with only Bold, Link, and Image available in the Toolbar
{
"name" : "description",
"label" : "Description",
"required" : false,
"locked" : false,
"type" : "richtext",
"default" : null,
"enabled_features" : ["bold","link","image"]
}
L'éditeur de contenu verra alors l'éditeur de texte enrichi avec uniquement les options incluses activées, comme illustré dans l'image ci-dessous :
Remarque : Certaines fonctionnalités, telles que le bouton Effacer les styles qui vous permet de revenir au style par défaut de l'éditeur, seront toujours activées et ne peuvent pas être supprimées. Si la propriété enabled_features
est omise, toutes les fonctionnalités apparaîtront.
Voici une liste des fonctionnalités qui peuvent être activées individuellement lors de l'utilisation de la propriété enabled_features
.
Option | Description |
---|---|
colors
| Contrôles de la couleur du texte et de l'arrière-plan. |
fonts
| Contrôles de la famille de polices et de la taille de police. |
indents
| Contrôles du retrait négatif et du retrait. |
lists
| Contrôles de listes à puces et numérotées. |
standard_emphasis
| Contrôles du texte gras, italique et souligné. |
advanced_emphasis
| Contrôles de texte barré, d'exposant, d'indice et de format de code. |
glyphs
| Contrôles d'émojis, de caractères spéciaux et d'icônes. Non pris en charge dans les modules d'e-mail. Pour ajouter le sélecteur d'emoji aux modules d'e-mail, utilisez plutôt emoji. |
Option | Description |
---|---|
block
| Affiche le menu déroulant du sélecteur de style. |
font_family
| Affiche le menu déroulant du sélecteur de police. |
font_size
| Affiche le menu déroulant de la taille de la police. |
bold
| Affiche le bouton de texte en gras. |
italic
| Affiche le bouton de texte en italique. |
underline
| Affiche le bouton de texte souligné. |
text_color
| Affiche le bouton de couleur du texte. |
background_color
| Affiche le bouton de couleur d'arrière-plan. |
alignment
| Affiche le bouton d'alignement. |
bulleted_list
| Affiche le bouton de liste à puces. |
numbered_list
| Affiche le bouton de liste numérotée. |
lineheight
| Affiche le bouton de hauteur de ligne. |
outdent
| Affiche le bouton de retrait négatif. |
indent
| Affiche le bouton de retrait. |
strikethrough
| Affiche le bouton de texte barré. |
superscript
| Affiche le bouton d'exposant. |
subscript
| Affiche le bouton d'indice. |
code_format
| Affiche le bouton de format de code. |
Option | Description |
---|---|
link
| Affiche le bouton de lien. |
image
| Affiche le bouton d'image. Non pris en charge dans les modules d'e-mail. |
emoji
| Affiche le bouton d'émoji. |
personalize
| Affiche l'élément de barre d'outils de personnalisation. |
cta
| Affiche l'élément de menu de call-to-action sous le menu d'insertion. |
embed
| Affiche l'élément de menu d'intégration sous le menu d'insertion. |
video
| Affiche l'élément de menu vidéo sous le menu d'insertion. |
table
| Affiche l'élément de menu de tableau sous le menu d'insertion. |
charmap
| Affiche l'élément de menu de caractères spéciaux sous le menu d'insertion. |
anchor
| Affiche l'élément de menu d'ancrage sous le menu d'insertion. |
hr
| Affiche l'élément de menu de ligne horizontale sous le menu d'insertion. |
nonbreaking_space
| Affiche l'élément de menu d'espace insécable sous le menu d'insertion. |
icon
| Affiche l'élément de menu d'icône sous le menu d'insertion. |
Option | Description |
---|---|
source_code
| Affiche l'élément de menu de code source sous le menu avancé. |
visual_blocks
| Affiche l'élément de menu d'affichage des blocs sous le menu avancé. |
Merci d'avoir partagé votre avis.
Comment utiliser enabled_features