Modifier les composants

Lorsque vous créez ou gérez votre thème, vous pouvez modifier les composants individuels pour mieux correspondre à votre marque et respecter les normes de conformité en matière d’accessibilité. Les accroches de thème que vous pouvez modifier sont spécifiques à chaque type de composant.

Avant de commencer

Rôle requis : admin

Pourquoi et quand exécuter cette tâche

Les composants que vous pouvez modifier ont Générateur de thèmes été créés dans Now Système de design. Pour plus d’informations, consultez Composants Next Experience sur le ServiceNow portail des développeurs.

Le nombre total de violations d’accessibilité par composant est indiqué sur la page du panneau de modification.

Procédure

1. Accédez à la Tous > Cadre de travail Now Experience > Thèmes > Générateur de thèmes.
   La page de destination de Theme Builder s’affiche dans la vue de la page d’accueil.
2. À partir du bouton Accueil , sélectionnez la vue de la page Éditeur .

   Figure 1. Vue de la page de l’éditeur

   

3. Sélectionnez le thème pour lequel vous souhaitez modifier des composants.
4. Dans la vue de la page Editeur, sélectionnez l’onglet Styles de composant .
   Les styles de composant sont répertoriés graphiquement.

   

5. Sélectionnez Modification.
   Remarque :

   Les composants qui peuvent être modifiés s’affichent. Pour en savoir plus sur le filtrage de la liste des composants afin de localiser le composant que vous souhaitez modifier, reportez-vous à la section Prévisualiser les composants.
6. Sélectionnez le composant que vous souhaitez modifier.
   Si un avertissement s’affiche dans l’onglet de modification, vous devez résoudre tous les avertissements à l’intérieur du panneau d’interaction du composant pour supprimer le signe d’avertissement du composant.
7. Dans le panneau de style configurable situé à droite, modifiez les crochets de thème disponibles pour le composant sélectionné selon vos besoins.

   Les accroches de thème modifiables disponibles dépendent du type de composant que vous avez sélectionné. Par exemple, si vous sélectionnez un composant de badge , vous pouvez modifier les couleurs et les crochets d’accessibilité du badge. Si vous sélectionnez un composant de lien de texte , vous pouvez modifier la couleur de base et les points d’accessibilité.

   Une fois que vous avez mis à jour les points d’accroche spécifiques au composant, les modifications que vous apportez au style global ne mettent pas à jour les styles du composant. Cela est dû au fait que les styles spécifiques au composant ont priorité sur les styles définis globalement.

8. Si vous sélectionnez une couleur à modifier, le sélecteur de couleurs s’ouvre.

   Figure 2. Sélecteur de couleurs

   

   Remarque :

   Par défaut, le sélecteur de couleurs affiche toutes les couleurs disponibles pour le composant. Vous pouvez sélectionner le curseur Masquer les choix inaccessibles pour limiter les choix de couleurs à celles identifiées comme accessibles, conformément aux directives WCAG actuelles.
9. Lorsque vous avez terminé vos modifications, sélectionnez Enregistrer les modifications.
10. Lorsque vous examinez les composants répertoriés dans la page d’édition, notez que certains composants peuvent afficher le symbole suivant.

    

    Remarque :

    Le symbole d’avertissement d’accessibilité indique que le contraste des couleurs du composant sélectionné n’est pas conforme aux normes d’accessibilité WCAG 2.1 en matière de contraste des couleurs. Pour plus d'informations, consultez Ajuster les composants pour répondre aux normes d’accessibilité.