Mises à jour de l’éditeur HTML TinyMCE 5
Les modifications apportées de TinyMCE 4 à TinyMCE 5 peuvent nécessiter des mises à jour pour conserver les fonctionnalités de l’éditeur HTML TinyMCE. Si vous avez utilisé un fournisseur d’angle de widget pour modifier l’éditeur dans Portail de services les widgets dans les versions précédentes, examinez ces changements et effectuez les mises à jour applicables.
Changements pouvant interrompre les implémentations TinyMCE personnalisées
Certains changements peuvent interrompre les implémentations TinyMCE personnalisées dans Portail de services.
Notez les modifications suivantes apportées aux thèmes et aux habillages :
- Le thème moderne n’est pas pris en charge. Utilisez plutôt le thème argenté.
- La peau gris clair n’est pas prise en charge. La peau par défaut est l’oxyde.
Les habillages sn-editor-themed ou sn-editor peuvent également être utilisés. L’habillage sur le thème sn-editor utilise les variables de thème Now Design System (NDS) et sn-editor utilise des valeurs codées en dur.
Remarque :Pour conserver le style de la peau gris clair, utilisez le code suivant dans votre feuille de style :.tox .tox-toolbar-overlord { background-color: #f0f0f0 !important; }
Notez les modifications suivantes apportées aux espaces de noms de méthode API dans Portail de services:
| San Diego | Tokyo |
|---|---|
| ed.addButton | ed.ui.registry.addButton |
| Onclick | onAction (en anglais seulement) |
Reportez-vous à la documentation Tiny MCE5 Migrer de TinyMCE 4 vers TinyMCE 5 pour plus d’informations.
Modifications supplémentaires
Les modifications suivantes peuvent affecter les implémentations TinyMCE personnalisées dans Portail de services:
- Le menu contextuel du navigateur pour des fonctionnalités telles que le copier-coller est disponible en sélectionnant
Ctrl + clicpour Windows ouCommande + clicpour Mac sur votre clavier. Un clic droit ouvre l’option Lien au lieu du menu contextuel du navigateur. - Les espaces réservés HTML ne sont pas pris en charge. Seuls les espaces réservés basés sur des chaînes sont pris en charge.
- Le module d’extension en lecture seule personnalisé n’est pas disponible par défaut. Vous devez ajouter
readonlynoborderàglide.ui.html.editor.v5.enabled_plugins. La nouvelle propriété système
glide.ui.html.editor.default_link_targetvous permet de définir une valeur cible par défaut pour les liens. Les valeurs de chaîne comprennent :« _blank »,« _self»et« _top ».La valeur cible par défaut est''.- L’option
de redimensionnementredimensionne la barre d’outils en plus de l’éditeur. Ajoutezl’option min_heightpour empêcher leredimensionnementde s’appliquer à la barre d’outils. Le redimensionnementn’est pas pris en charge sur Mobile.L’option toolbar_modeest définie surflottantpar défaut pour le bureau plutôt que surl’option enveloppante. Modifiez ce paramètre pour restaurer l’apparence par défaut de TinyMCE 4.L’option toolbar_modeest définie pourdéfilerpar défaut pour mobile plutôt quepour envelopper. Modifiez ce paramètre pour mobile afin de conserver l’apparence de TinyMCE 4.- L’option de
hauteurtient compte de toute la hauteur de l’éditeur et a été mise à jour pour ajouter 39 pixels pour la barre d’outils et 18 pixels pour la barre d’état.Remarque :Si la hauteur n’est pas définie correctement, une barre de défilement inutile peut apparaître. - Le module d’extension sn_mentions utilise l’habillage sn-editor. L’habillage sur le thème sn-editor est également pris en charge.
- L’option
contextmenucomprend uniquement une option de lien par défaut. Ajoutezcontextmenu :falsepour conserver l’apparence de TinyMCE 4. - Les valeurs de l’option
fontsize_formatssont séparées par un espace, comme dansfontsize_formats : '7pt 7.5pt 8pt 10pt 12pt 14pt 18pt 24pt 36pt'. Les barres verticales (|) ne sont plus nécessaires. - Le module d’extension PowerPaste se trouve dans la liste d’options des
modules d’extensionplutôt que dans la liste desoptions des modules d’extension externes.San Diego Tokyo external_plugins: { powerpaste: '/scripts/tinymce4_4_3/plugins/powerpaste/plugin.min.js?sysparm_substitute=false' },plugins: "lists code link powerpaste" - Les langues supplémentaires suivantes sont prises en charge : canadien français (fq), hongrois (hu), thaï (th) et turc (tr). Vous pouvez mettre à jour la liste des langues comme suit pour inclure ces langues :
var langs = 'cs,de,en,es,fi,fr,fq,he,hu,it,ja,ko,nl,pl,pt,ru,th,tr,zh,zt'; - Les styles CSS appliqués à l’aide de l’espace de noms
mce-ne sont pas pris en charge. Utilisez plutôt les nouvelles classes CSS. - Ajoutez le module d’extension Lists à la liste d’options des
modules d’extensionpour pouvoir utiliser des listes numérotées ou à puces.