--- sourceDocument: Interface utilisateur de la Now Platform Xanadu sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/fr-FR/xanadu/platform-user-interface Release : - xanadu ft:locale : - fr-FR ft:publication_title : - Interface utilisateur de la Now Platform Xanadu ft:clusterId : - platux bundleId : - platux workflow : - Platform --- # Configurer un Next Experience thème # Configurer un Next Experience thème {#ariaid-title1} * Rversion finale: Xanadu * * Mis à jour 1 août 2024 * * ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 3 minutes de lecture Ajoutez les styles que vous avez créés à votre Next Experience thème pour modifier l'apparence de l'expérience utilisateur. ## Avant de commencer Assurez-vous que les propriétés système suivantes, situées dans `sys_properties.list,` sont définies sur vrai : * glide.ui.polaris.experience * glide.ui.polaris.dark_themes_enabled: pour réutiliser la Next Experience variante foncée dans ce thème. {#configure-next-experience-theme__ul_xxt_gn4_m5b} Rôle requis : administrateur ## Pourquoi et quand exécuter cette tâche Le thème par défaut Next Experience est appelé Polaris. Vous pouvez réutiliser ou personnaliser le thème comme point de départ lorsque vous créez ou modifiez vos propres thèmes. ## Pourquoi et quand exécuter cette tâche Remarque : Si vous personnalisez un thème que Générateur de thèmes vous avez créé et que vous saisissez du code JSON non valide, vous ne pouvez pas enregistrer votre enregistrement de thème. Lorsque vous travaillez dans l'enregistrement de thème UX, vous pouvez accéder à la page Éditeur à l'aide du bouton Ouvrir dans le générateur de thèmes . Pour plus d'informations, consultez [Gérer ou modifier un thème avec Générateur de thèmes](https://servicenow-prod.fluidtopics.net/qaVqDuoKiFgJvr8YTpMfVw "Personnalisez et gérez votre thème et votre style de manière efficace en termes de temps et d’argent. Vous pouvez publier de nouveaux thèmes sur les implémentations Web ou mobiles de votre instance."). ## Procédure 1. Accédez à la ToutCadre de travail Now ExperienceGestion des thèmesThèmes. 2. Créez un enregistrement de thème en sélectionnant Nouveau. 3. Entrez un nom et une description pour votre thème. 4. Sélectionnez l'icône Actions supplémentaires (icône ![Actions supplémentaires]()), puis sélectionnez Enregistrer. 5. Dans l'onglet Compositionnel : thème de l'application , insérez des lignes pour ajouter des styles associés à votre thème. Vous affectez des valeurs dans quatre colonnes : Applicabilité : Remplace le thème de base. Les utilisateurs qui satisfont aux contraintes d'applicabilité voient ces remplacements dans leur thème plutôt que dans le style de base. Par exemple, un style avec différentes polices peut être appliqué aux gestionnaires. Les utilisateurs qui répondent à l'applicabilité du gestionnaire voient les différentes polices dans l'interface Next Experience utilisateur, qui remplace les valeurs de thème du système de base. Les administrateurs n'ont pas besoin de copier ou de créer un thème entier avec des modifications pour l'audience applicable. Remarque : Si vous laissez la contrainte d'applicabilité vide, le style sera appliqué à tous les utilisateurs. Ordre : Spécifie quand le style est appliqué. Plus la commande est élevée, plus sa priorité est grande. Remarque : Si vous souhaitez utiliser un style personnalisé, assurez-vous que le numéro de commande de votre style est supérieur au style Polaris standard. Style : Configure quatre styles principaux. Vous ne pouvez pas modifier les noms de style utilisés dans le thème Polaris, mais vous pouvez copier le code JSON associé à chaque style de ce thème, puis le coller et le modifier dans la forme de votre style personnalisé. * Couleurs: Spécifie les propriétés de couleur du thème et toutes les variantes de base que vous souhaitez ajouter. Dans la section de base du style de couleur, un sous-ensemble de couleurs utilisées par le thème est défini avec des valeurs Rouge, Vert, Bleu (RVB). Le thème génère plus de 20 dégradés de ces couleurs dans l'application. * Forme et forme : Spécifie l'apparence des bordures ainsi que des boutons et autres contrôles de l'interface utilisateur. * Imagerie: Ajoute les images utilisées dans le thème de votre application. * Typographie: Spécifie les polices utilisées dans l'ensemble de l'application. {#configure-next-experience-theme__ul_odz_fkd_55b} Type : Spécifie deux types : Core et Variant. Les styles de base comprennent la couleur, la forme, la typographie et l'imagerie. Les variantes spécifient une version différente du thème, comme les différentes couleurs que les utilisateurs peuvent sélectionner. La variante la plus courante est une version sombre du thème. Le thème sombre est la seule variante livrée avec Next Experience. Pour plus d'informations, consultez [Explorer les thèmes dans Next Experience](https://servicenow-prod.fluidtopics.net/seQCgtMZQUmOUQKge7S_QQ "Les thèmes vous permettent d’adapter l’expérience visuelle à vos utilisateurs, ce qui permet de mettre à jour l’apparence pour qu’elle ressemble davantage à votre marque."). 6. Sélectionnez le champ Style, puis ![l’icône de recherche de style UX.]() 7. Sélectionnez Nouveau. 8. Sélectionnez les couleurs primaires, secondaires et neutres. Remarque : Un thème est composé de plusieurs variables, de sorte que vous remarquerez peut-être la coloration du thème Polaris par défaut à différents endroits. 9. Lorsque vous avez les couleurs de marque de votre organisation, accédez au générateur de couleurs à l'adresse . 10. Sélectionnez le bouton Générer automatiquement . Un modal s'affiche et vous demande d'entrer les trois couleurs de votre organisation. 11. Entrez vos valeurs de code hexadécimal pour les couleurs de votre organisation. 12. Sélectionnez Générer. 13. Rassemblez vos variables CSS en sélectionnant Copier JSON. 14. Remplissez le formulaire de style UX. {#configure-next-experience-theme__table_hh5_w11_45b__entry__2} | Champ | Description | |-|-| | Nom | Nom de votre style UX. | | Type | * Principal * Variante {#configure-next-experience-theme__ul_hjp_z11_45b} Pour plus d'informations sur les types, reportez-vous à [la section Différence entre les styles de base et les variantes](https://servicenow-prod.fluidtopics.net/9Ub3yXC5NXSb_iNKuv55Pw "Vous pouvez adapter l’apparence de l’interface Next Experience utilisateur à différents utilisateurs en configurant les styles de base, les variantes et les autres palettes de couleurs."). | | Style | Valeurs pour les couleurs, les formes et les formes. Certaines des valeurs sont des couleurs et d'autres, comme les bordures, sont des valeurs de pixels. Important : Le code JSON doit être encapsulé comme indiqué dans l'exemple suivant. | | Application | Champ d'application du style UX. | [ ] {#configure-next-experience-theme__table_hh5_w11_45b} 15. Sélectionnez Soumettre. 16. Sélectionnez Mettre à jour. Remarque : Pour utiliser votre nouveau thème afin de remplacer le thème par défaut, reportez-vous à la section [Remplacer le Next Experience thème](https://servicenow-prod.fluidtopics.net/2zSRmUI8IdyzW4L~0oNxBg "Remplacez le Next Experience thème par votre thème personnalisé.").