AX - Conteneur de puces

Aperçu

AX - Conteneur de puces est un composant Experience Cloud qui affiche une collection d'étiquettes interactives (puces) sur les pages des sites Experience.

Utilisez-le pour afficher des éléments connexes, des catégories, des compétences, des filtres ou toute donnée groupée dans un format compact et visuel. Les utilisateurs peuvent interagir avec les puces pour sélectionner, supprimer ou déclencher des actions. Configurez le style et le comportement des puces dans Experience Builder sans code.

Parfait pour les sélections de filtres, l'affichage d'étiquettes, les badges de compétences, les listes de catégories ou partout où les utilisateurs du portail doivent voir et interagir avec plusieurs éléments liés de manière peu encombrante.

Configuration du conteneur de puces

Paramètres généraux

1. Ligne unique

• Fonctionnalité : Détermine si les puces sont affichées sur une seule ligne ou peuvent être réparties sur plusieurs lignes.

• Utilisation : Utile pour maintenir une disposition compacte ou pour accueillir un nombre plus important de puces.

2. Est réductible

• Fonctionnalité : Permet au conteneur de puces d'être réductible.

• Utilisation : Idéal pour les scénarios où vous souhaitez économiser de l'espace ou gérer la visibilité des puces.

3. Est développé

• Fonctionnalité : Définit l'état initial du conteneur de puces sur développé.

• Utilisation : Utile lorsque vous voulez que toutes les puces soient immédiatement visibles pour l'utilisateur au chargement.

Configuration de la source de données pour le conteneur de puces Avonni

Le conteneur de puces Avonni propose deux méthodes principales d'intégration des données : Manuelle et Source de données par requête. Chaque méthode répond à des objectifs distincts et convient à différents scénarios, allant des affichages de données statiques à l'intégration dynamique et en temps réel des enregistrements Salesforce.

Source de données manuelle

• Fonctionnalité :

  • Ce paramètre permet une saisie directe et manuelle des données dans le conteneur de puces.

• Utilisation :

  • Ceci est particulièrement utile lorsque les données des puces ne proviennent pas dynamiquement des enregistrements Salesforce.

  • Il est idéal pour les configurations initiales, les environnements de test ou les scénarios où des données statiques sont préférées.

Source de données par requête

• Fonctionnalité :

  • L'option de requête permet au conteneur de puces de récupérer et d'afficher automatiquement des données provenant des enregistrements Salesforce.

• Utilisation :

  • Parfait pour les cas où les puces doivent être alimentées dynamiquement avec des informations à jour depuis Salesforce.

  • Facilite la réflexion des données en temps réel, ce qui en fait un excellent choix pour les sites dynamiques et pilotés par les données.

Mappings de données pour la source de données par requête

Le processus de mappage des données est essentiel pour l'exactitude et la pertinence des données affichées dans le conteneur de puces.

• Processus :

  • Il consiste à aligner et à mapper soigneusement les champs Salesforce sur les attributs correspondants du conteneur de puces. Cette étape garantit que les données sont récupérées et présentées de manière significative et organisée.

• Résultat :

  • Un mappage de données approprié garantit que les données récupérées depuis Salesforce sont correctement représentées dans les puces, assurant des affichages pertinents et contextuellement exacts.

Paramètres de style

Aperçu

Personnaliser le style du composant Avonni Chip Container est crucial pour aligner son apparence avec l'esthétique globale de votre site Salesforce Experience Cloud. Le composant offre une gamme d'options de style permettant une personnalisation détaillée, assurant à la fois fonctionnalité et attrait visuel.

Options d'espacement

Début/Fin du bloc du conteneur de puces, Début/Fin en ligne :

• Ces paramètres contrôlent l'espacement autour du conteneur de puces en orientation bloc (verticale) et en ligne (horizontale).

• L'ajustement de ces valeurs peut aider à créer la marge visuelle souhaitée entre les puces et les autres éléments, améliorant la lisibilité et la cohérence de la mise en page.

Style du conteneur de puces

• Arrière-plan, couleur de la bordure, taille, style et rayon :

  • Personnalisez la couleur d'arrière-plan pour compléter ou contraster avec le thème du site.

  • Les options de personnalisation de la bordure (couleur, taille, style et rayon) offrent un contrôle sur le contour du conteneur, permettant de le faire ressortir ou de le fondre harmonieusement avec les autres éléments de la page.

Style individuel des puces

• Taille, poids, style de la police de l'étiquette ; taille, style, rayon de la bordure ; hauteur de ligne :

  • Ajustez finement la typographie des étiquettes des puces pour la clarté et l'alignement avec la marque.

  • Les ajustements de la bordure et de la hauteur de ligne améliorent l'impact visuel de chaque puce, les rendant plus distinctes et plus faciles à manipuler.

Personnalisation des avatars dans les puces

• Taille, couleur, style de la bordure ; couleur/épaisseur de la police des initiales, couleur de fond de l'icône, ajustement de l'objet image :

  • Les avatars au sein des puces peuvent être stylisés pour correspondre au design du site, avec des options pour ajuster les propriétés de la bordure et les caractéristiques de la police des initiales.

  • Les paramètres 'Image Object Fit' tels que 'fill', 'contain', 'cover', etc., sont essentiels pour garantir que les images des avatars s'affichent correctement sans distortion.

Paramètres de style de variante

• Personnalisable en fonction de la variante sélectionnée :

  • Le composant Conteneur de puces offre un style basé sur les variantes, ce qui signifie que différents styles peuvent être appliqués selon la variante de puce sélectionnée.

  • Cette fonctionnalité permet une plus grande flexibilité et créativité dans la conception, garantissant que chaque variante de puce puisse avoir un aspect unique mais cohérent au sein du conteneur.