Gérer les Générateur d'IU pages et les variantes de page
Découvrez dans quoi se trouve une page.Générateur d'IU Prenez connaissance des blocs de construction d’une Générateur d'IU page, tels que les mises en page et les composants des colonnes.
Générateur d'IU Démarrage rapide
Dispositions et composants de colonnes dans Générateur d'IU
Les mises en page et les composants des colonnes sont les éléments constitutifs de votre Générateur d'IU page. Ajoutez des mises en page et des composants de colonnes à votre page pour créer ou personnaliser votre expérience d’espace de travail ou de portail. Par exemple, ajoutez une mise en page de colonne et, dans une colonne, placez un composant de bouton qui permet aux utilisateurs d’envoyer des demandes.
Vous pouvez ajouter des mises en page de colonnes, des colonnes et des composants, ainsi que naviguer entre eux, à partir de l’étape ou de l’arborescence de contenu.
Une mise en page de colonne peut contenir une ou plusieurs colonnes. Les colonnes peuvent contenir des composants. Modifiez le style visuel des mises en page des colonnes, des colonnes et des composants pour en faire votre propre expérience.
| Tapez | Description |
|---|---|
| Mise en page en colonne | Conteneur flexible avec une à six colonnes. Ajoutez des mises en page en colonnes pour fournir une structure et un cadre à une page. |
| Colonne | Remplir les colonnes avec des composants. |
| Composant | Les éléments de base d’une page, tels que les boutons, les listes et les formulaires. |
| Modal | Utilisez un modal pour créer un type Générateur d'IU de page qui s’affiche en haut de la page et nécessite une action. |
| Popover | Un popover est un type de conteneur qui apparaît au-dessus d’une Générateur d'IU page lorsqu’il est déclenché par un événement. Utilisez le composant popover pour afficher des informations ou des actions supplémentaires liées à la page. |
Créer une page UI Builder
Créez une Générateur d'IU page pour créer une expérience de page à partir de zéro ou utilisez un modèle de page. Créez une page, un composant à la fois. Si vous utilisez l’un des modèles de page prédéfinis, vous partez d’une structure de base et pouvez la personnaliser en fonction de vos besoins.
Nommez votre Générateur d'IU page. Définissez le chemin d’accès (ou conservez le chemin d’accès par défaut qui est automatiquement ajouté en fonction du nom de votre page). Un chemin d’accès par défaut est ajouté en fonction du nom de votre page. Vous pouvez également créer votre propre chemin d’accès, mais celui-ci doit être unique. L’aperçu de l’URL indique le chemin d’accès de votre page.
Le périmètre de l’application protège les applications en identifiant et en limitant l’accès aux fichiers et données d’application. Le périmètre de l’application est défini par défaut sur le périmètre dans lequel l’utilisateur se trouve actuellement dans le Now Platform®. Pour plus d’informations sur le périmètre de l’application, reportez-vous à En savoir plus sur la sécurité et les rôles.
Utilisez un Générateur d'IU modèle de page pour créer une page basée sur un modèle de page prédéfini, puis personnalisez la page en fonction de vos besoins. Vous pouvez référencer ou copier un modèle de page. Pour plus d'informations, consultez Créer une page à partir d’un modèle.
Créer une page UI Builder : paramètres avancés
Ajoutez les paramètres requis à votre Générateur d'IU page. Un paramètre obligatoire est un élément de données dont votre page a besoin, tel qu’un sys_id, une table ou une requête. Les paramètres requis sont utiles pour les composants, car ils peuvent se lier à la valeur du paramètre requis. Par exemple, vous pouvez ajouter un paramètre de table au champ URL, puis lier des données à cette table. Lorsque la table est référencée, elle expose ses données à tous les composants de la page. Les paramètres requis sont visibles dans l’URL lorsque vous les ajoutez à votre page. Dans l’exemple suivant, un paramètre obligatoire appelé table a été ajouté. Notez qu’il a été ajouté à l’URL.
Ajoutez des paramètres facultatifs à votre Générateur d'IU page. Les paramètres facultatifs sont des éléments de données facultatifs que vous pouvez ajouter à l’URL de votre page. Contrairement aux paramètres requis, les paramètres facultatifs sont toujours des paires de noms et de valeurs qui fonctionnent, peu importe l’ordre dans lequel ils sont fournis.
Définissez les paramètres d’audience et de conditions pour Générateur d'IU les variantes de page. Lorsque vous créez une page, crée Générateur d'IU également une variante de la page pour vous par défaut. Une variante de page est une variation de votre page au même chemin d’accès qui vous permet de cibler les expériences de différentes audiences à l’aide de critères d’utilisateur. Par exemple, une page pour les responsables et une variante de cette page pour les subordonnés directs du responsable. Pour en savoir plus sur la création d’une variante, reportez-vous à Créer une variante de page.
Pour en savoir plus sur les audiences, reportez-vous à En savoir plus sur les audiences.
Valeurs de test dans Générateur d'IU
Ajoutez une valeur de test à votre Générateur d'IU page afin d’intégrer des données de test dans la page à des fins de test. Par exemple, si vous ajoutez une table comme paramètre requis, vous pouvez ajouter une valeur test d’incident et lui lier une ressource de données pour apporter des données de test sur l’incident pour cette table.
Pour obtenir des valeurs de test afin d’afficher des données, ajoutez une ressource de données, puis configurez la ressource de données pour lier un enregistrement à la valeur de test dans l’URL. Par exemple, vous pouvez ajouter l’incident comme valeur de test. Ajoutez ensuite une ressource de données nommée Rechercher un enregistrement unique. Dans le champ Table, liez dynamiquement la valeur de test d’incident à une table context.props.table , comme illustré dans l’image suivante.
Afficher une page UI Builder existante
Vous pouvez travailler sur n’importe quelle Générateur d'IU page de votre expérience en fonction des paramètres de votre rôle. Cliquez sur le nom de la page sur laquelle vous souhaitez travailler lorsque vous vous trouvez dans la vue d’expérience de votre expérience.
Lorsque vous êtes dans l’éditeur de page, ouvrez une autre variante de page en sélectionnant la liste déroulante dans l’en-tête.
Créer une variante de page UI Builder
Une variante vous permet de cibler différentes audiences avec un contenu différent, à l’aide de critères d’utilisateur. Par exemple, vous pouvez créer une page d’accueil pour les agents et une variante de la page pour les gestionnaires qui existe sur le même chemin d’accès URL.
Vous définissez l’audience pour chaque Générateur d'IU variante de page. L’audience détermine qui utilise la variante de page. Par exemple, si vous créez une page de demande de déplacement, créez une variante de cette page pour que les gestionnaires gèrent les demandes de déplacement des employés. Vous définissez l’audience de la page de gestionnaire pour toute personne disposant du rôle de gestionnaire. Les employés ne peuvent pas afficher cette variante. Pour en savoir plus sur les audiences, reportez-vous à En savoir plus sur les audiences.
Consultez Créer une variante de page pour plus d'informations.
Modifier les paramètres de page de Générateur d’IU
Modifiez les paramètres de votre Générateur d'IU page à tout moment en sélectionnant Paramètres dans la vue d’expérience Générateur d'IU . Vous pouvez modifier le nom, le chemin d’accès et les paramètres de votre page après avoir créé une page.
Consultez Modifier une page pour plus d'informations.
Générateur d'IU Arborescence de contenu
Lorsque vous cliquez sur un composant dans l’arborescence de contenu, celui-ci est mis en surbrillance sur votre scène afin que vous puissiez le configurer, lui ajouter des styles, des événements, des données, etc. Vous pouvez faire glisser des éléments dans l’arborescence de contenu pour réorganiser votre page.
Il est important d’ajouter une étiquette de composant lorsque vous ajoutez un composant à votre page. L’étiquette de composant est utilisée dans l’arborescence de contenu pour appliquer des ID d’étiquettes à chaque composant de l’arborescence de contenu. Vous pouvez identifier les composants beaucoup plus facilement dans l’arborescence de contenu lorsqu’ils sont étiquetés de manière appropriée.
Générateur d'IU Toolbox
Utilisez la Générateur d'IU boîte à outils pour ajouter des mises en page et des composants à votre page. Accédez à la Générateur d'IU boîte à outils en sélectionnant + Ajouter un composant ou l’icône + dans l’étape.
Effectuez une recherche dans la boîte à outils pour trouver les mises en page et les composants que vous souhaitez ajouter à une Générateur d'IU page.
Affichez une description brève d’une mise en page ou d’un composant en sélectionnant l’icône d’informations pour afficher l’info-bulle. L’onglet Composants affiche différentes couleurs si un composant peut utiliser un paramètre prédéfini ou s’il est regroupé avec plusieurs composants.
Étape Générateur d'IU
L’étape est la plus grande zone de l’éditeur Générateur d'IU et est utilisée pour créer des pages. Ajoutez vos mises en page et composants de colonnes ici en sélectionnant un bouton + ou en faisant glisser le volet Composant vers la page.
Sur la scène, le corps, la disposition des colonnes et les colonnes sont indiqués en magenta. Les composants sont entourés en bleu.
Utilisez l’icône Élément d’arborescence pour accéder à une autre couche de contenu. Par exemple, si une colonne est sélectionnée, accédez facilement à la mise en page de la colonne parente ou à un composant de la colonne.
Sélectionnez l’icône Menu sur une colonne, une mise en page ou un composant pour des options telles que la duplication et la suppression.
Les modifications apportées à l’étape sont répercutées dans le panneau Styles à droite. Les modifications apportées dans le panneau Styles mettent immédiatement à jour les éléments de la scène.
Mettre à l’échelle la taille de l’étape dans Générateur d'IU
Ajustez la taille de la scène dans l’éditeur Générateur d'IU en sélectionnant la liste déroulante Largeur.
Annuler et O rougedans Générateur d'IU
Annulez et rétablissez les modifications que vous avez apportées à votre Générateur d'IU page. Annulez toute action que vous effectuez sur une mise en page, un composant, un style ou une mise en page.
La fonction d’annulation et de rétablissement se trouve dans la barre d’outils de l’en-tête. Vous pouvez sélectionner le bouton Annuler ( ) ou Rétablir (
) pour inverser une action. Vous pouvez également cliquer sur le menu déroulant Annuler pour revenir en arrière de plusieurs étapes. Vous ne pouvez pas annuler ou rétablir les modifications apportées dans l’étagère de données.
Vous pouvez annuler les 20 actions précédentes en sélectionnant la liste déroulante Annuler.
Générateur d'IU Panneau de configuration
Utilisez le panneau de configuration pour travailler avec des composants, y compris l’organisation, l’application d’un style et la configuration des gestionnaires d’événements.
- Sélectionnez l’onglet Configuration pour configurer les composants. Chaque composant dispose de différentes options de configuration qui vous permettent de contrôler les parties nécessaires du composant. Par exemple, un composant de bouton est simple et vous ne pouvez configurer que son apparence, son étiquette et quelques propriétés. Un composant de liste est plus compliqué et contient des dizaines de paramètres de liste modifiables.
- Sélectionnez l’onglet Styles dans le panneau de configuration pour ajouter un style à un composant. Vous pouvez utiliser des feuilles de style en cascade (CSS) basées sur des normes pour modifier le style visuel d’un composant. Par exemple, ajoutez ou modifiez une couleur d’arrière-plan, une bordure ou tout autre style CSS.
Consultez Modifier l’apparence par défaut des composants pour plus d'informations. - Sélectionnez l’ongletÉvénements pour configurer les événements qui ajoutent des actions à vos composants, pages, ressources de données et actions déclaratives. Lorsque vous ajoutez des composants à votre Générateur d'IU page, ils ne sont pas configurés pour effectuer une action. Par exemple, un composant de bouton est statique et ne fait rien tant que vous ne lui avez pas lié une action d’événement, telle que la suppression d’un enregistrement.
Consultez Gérer les actions dans les pages UI Builder (fonctionnalité avancée) pour plus d'informations. - Les colonnes lrégissent la façon dont les composants sont disposés sur une page. Lorsque vous ajoutez une mise en page en colonne à une Générateur d'IU page, vous pouvez configurer la façon dont vous souhaitez concevoir la mise en page. Après avoir ajouté un composant à une colonne dans la mise en page, vous pouvez configurer les éléments de manière plus avancée. Par exemple, vous pouvez justifier le contenu, aligner les éléments et définir la hauteur, la largeur, les marges, l’arrière-plan, les bordures et le remplissage de la disposition de vos colonnes, colonnes et composants. La grille CSS est le système de mise en page le plus puissant. La grille CSS est construite sur une grille bidimensionnelle qui vous donne le pouvoir sur la façon dont vous créez vos pages.
Consultez Organiser les composants dans les pages de Générateur d’IU pour plus d'informations.
Ouvrir une page UI Builder pour la prévisualiser
Affichez un aperçu d’une Générateur d'IU page pour voir à quoi elle ressemble en tant que page Web.
Sélectionnez le bouton pour tester la variante sur laquelle vous travaillez actuellement, y compris les modaux, les fenêtres d’affichage, les composants, les ressources de données et les données dynamiques. L’aperçu d’une variante de page est utile pour voir à quoi elle ressemble et comment elle fonctionne lors de la création d’une expérience.
Une autre méthode pour prévisualiser une page consiste à demander le chemin de l’URL au serveur. Utilisez cette méthode pour tester si un utilisateur voit la variante lorsqu’il ouvre la page. Sélectionnez la flèche déroulante en regard de Aperçu, puis sélectionnez Ouvrir ou sélectionnez Aperçu > Ouvrir le chemin de
.
Consultez Découvrez comment afficher et tester votre Générateur d'IU expérience pour plus d'informations.
Modification par les développeurs dans Générateur d'IU
Dans le menu, modifiez la Générateur d'IU page en tant que développeur sur la plateforme. Cette option vous permet de modifier les détails au niveau de la plate-forme de votre page et vous fait sortir de Générateur d'IU. Vous devez avoir le rôle approprié en tant que développeur.