Configurer un Next Experience thème

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.

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.

Procédure

1. Accédez à la Tout > Cadre de travail Now Experience > Gestion des thèmes > Thè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 ), 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.

   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.

6. Sélectionnez le champ Style, puis
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 https://theme.deoprototypes.com/color-generator-algo-v1.
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.

    Champ	Description
    Nom	Nom de votre style UX.
    Type	Principal Variante Pour plus d’informations sur les types, reportez-vous à la section Différence entre les styles de base et les variantes.
    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.

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.