Résolution des problèmes d’habillage du texte des infobulles et des messages de validation dans les boîtes de dialogue de création d’AEM 6.5
Cet article explique comment identifier et résoudre les problèmes d’habillage incorrect des infobulles et du texte du message de validation dans les boîtes de dialogue de création de Adobe Experience Manager (AEM) 6.5, ce qui entraîne le fractionnement des mots ou des problèmes d’espacement visuel.
Description description
Environnement
- Adobe Experience Manager (AEM) 6.5
- Créer des boîtes de dialogue à l’aide de composants prêts à l’emploi
Problème/Symptômes
- Les infobulles et le texte du message de validation des boîtes de dialogue de création s’affichent avec des sauts de ligne ou un espacement visuel incorrects.
- Les mots peuvent être fractionnés au milieu et redirigés vers la ligne suivante, même lorsque l’info-bulle est courte (par exemple, « Veuillez remplir ce champ »).
Cause
Ce problème est généralement provoqué par une règle CSS dans une bibliothèque cliente prête à l’emploi qui applique des propriétés de saut de mot ou d’espacement qui entraînent le fractionnement des mots entre les lignes des infobulles et des messages de validation.
Résolution resolution
Pour résoudre le problème d’habillage du texte dans l’info-bulle et le message de validation, procédez comme suit :
-
Reproduisez le problème en ajoutant une courte info-bulle ou un message de validation (tel que 'Veuillez remplir ce champ’) à un champ de boîte de dialogue de création et observez le comportement d’habillage du texte dans l’interface utilisateur de la boîte de dialogue.
-
Utilisez les outils de développement du navigateur (tels que Chrome DevTools) pour inspecter l’info-bulle ou l’élément de message de validation :
- Cliquez avec le bouton droit sur l’info-bulle concernée et sélectionnez Inspecter.
- Dans l’onglet Calculé, passez en revue les propriétés CSS suivantes :
width,max-width,word-break,overflow-wrapetwhite-space.
-
Décochez ou désactivez temporairement les règles CSS chargées à partir des bibliothèques clientes spécifiques au projet (par exemple,
/etc.clientlibs/...ou/apps/...). -
Vérifiez si l’info-bulle s’affiche correctement après la désactivation de ces règles. Si le problème persiste et est suivi jusqu’à une bibliothèque cliente prête à l’emploi (telle que
/libs/cq/gui/components/authoring/dialog/clientlibs/all.min.*.css), notez qu’une modification du code ou de la configuration peut ne pas être directement possible. -
Si vous ne parvenez pas à résoudre le problème par le biais de remplacements ou d’une configuration CSS personnalisée, consultez les Service Packs et notes de mise à jour d’AEM 6.5 les plus récents afin de déterminer si un correctif public est disponible. Si aucun correctif public n’est disponible, pensez à contacter l’assistance technique d’🔗 pour obtenir de l’aide.
-
Après avoir apporté des modifications ou appliqué des mises à jour, vérifiez que les infobulles et les messages de validation s’affichent correctement sans sauts de mots indésirables ou problèmes d’espacement.