> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-fr/experience-components/ax-avatar-group.md).

# AX - Groupe d’avatars

## Aperçu

**AX - Groupe d’avatars** est un composant Experience Cloud qui affiche plusieurs photos de profil, initiales ou icônes dans une rangée compacte sur les pages des sites Experience.

Utilisez-le pour afficher des membres d’équipe, des contributeurs à un projet, des contacts de compte ou tout groupe d’utilisateurs ou d’enregistrements associés. Le composant empile les avatars horizontalement et affiche un indicateur « +X » lorsque le nombre d’avatars dépasse l’espace d’affichage disponible.

Parfait pour les listes d’équipe, les groupes de collaboration, les affichages d’affectation de cas ou pour montrer qui a accès à des enregistrements partagés dans les portails clients ou partenaires.

***

## **Options de configuration**

### **Source de données**

Indiquez-lui où trouver les informations pour que votre groupe d’avatars affiche les bonnes personnes. C’est là que **les sources de données** entrent en jeu. Voyez cela comme une connexion de vos avatars au cœur de vos données Salesforce.

<figure><img src="/files/761b97eecae7c9027c2aa7ac039b9c6f6102e205" alt=""><figcaption></figcaption></figure>

#### **Manuel**

Cette option est particulièrement adaptée aux petites équipes ou aux situations où vous devez uniquement afficher des avatars pour un événement ou un projet précis.

1. **Ajouter chaque personne :** Vous saisirez leurs détails directement dans les paramètres du groupe d’avatars pour chaque personne que vous souhaitez inclure.
2. **Fournir les informations clés :** Cela comprend :
   * **Image de l’avatar :** Si vous avez une photo, vous pouvez la téléverser ici.
   * **Initiales :** Elles seront affichées si aucune image n’est disponible.
   * **Autres détails :** Vous pouvez inclure des informations supplémentaires comme le poste ou le service de la personne.

Bien que l’option manuelle demande davantage d’intervention, elle vous offre un contrôle total sur les personnes affichées dans votre groupe d’avatars.

#### **Requête**

Cette option est votre meilleur choix si votre équipe change fréquemment ou si vous souhaitez que les avatars correspondent toujours aux informations les plus récentes de votre organisation Salesforce.

Voici comment cela fonctionne :

1. **Choisissez votre objet :** Sélectionnez l’objet Salesforce (comme User, Contact ou un objet personnalisé) où se trouvent les informations de vos avatars.
2. **Mapper les données :** Faites le lien entre les attributs de votre groupe d’avatars (comme Nom, Titre, Photo de profil) et les champs correspondants de l’objet choisi. Cela indique exactement au groupe d’avatars où trouver les bonnes informations pour chaque personne.

En utilisant l’option Requête, votre groupe d’avatars devient le reflet dynamique de vos données Salesforce, affichant toujours les informations les plus précises et les plus à jour.

### **Variante**

* **Carré :** Les avatars sont affichés sous forme de carrés, avec un style classique et épuré.
* **Cercle :** Les avatars sont affichés sous forme de cercles plus modernes et plus conviviaux.
* **Vide :** Si aucune image n’est disponible, des initiales ou des icônes de remplacement apparaissent dans des cercles ou des carrés vides. Choisissez cette option pour maintenir une cohérence visuelle même lorsque les données d’image sont absentes.

<figure><img src="/files/a1bed699a76abf58809d882f0b777a9eb5cf6f77" alt=""><figcaption></figcaption></figure>

### **Taille**

* Contrôlez les dimensions de chaque avatar. Choisissez parmi une gamme de tailles pour vous adapter à la mise en page et au contexte de votre site. Les options incluent x-small, small, medium, large, x-large et xx-large.

### **Mise en page**

* **Pile :** Les avatars sont empilés verticalement, ce qui est idéal pour les espaces étroits ou les barres latérales.
* **Grille :** Les avatars sont disposés dans une grille, parfaite pour mettre en valeur un groupe plus important d’utilisateurs ou d’équipes.
* **Liste :** Les avatars sont affichés sur une rangée horizontale, ce qui est utile lorsque l’espace est limité, mais que vous souhaitez tout de même mettre en valeur plusieurs avatars.

### **Nombre max**

* Limitez le nombre d’avatars affichés dans le groupe. Cela aide à conserver une mise en page épurée et évite de submerger l’utilisateur avec trop d’éléments visuels.

### **Initiales formatées automatiquement (interrupteur)**

* Activez cette option pour afficher automatiquement les initiales des utilisateurs ou des équipes lorsque les images ne sont pas disponibles. Cela offre une représentation visuelle cohérente même lorsque les données d’image sont absentes.

### Lien vers (rendez vos avatars interactifs)

Considérez cette section comme un superpouvoir donné à vos avatars : emmener vos utilisateurs ailleurs lorsqu’ils cliquent dessus !

<figure><img src="/files/4549bca0158acba9f0da176fec84db1f6521730d" alt=""><figcaption></figcaption></figure>

#### Pourquoi est-ce utile ?

* **Profils des utilisateurs :** Imaginez afficher une équipe d’experts. En configurant un lien vers une action, cliquer sur un avatar pourrait ouvrir sa page de profil complète.
* **Actions personnalisées :** Peut-être souhaitez-vous qu’un clic déclenche un Flow spécifique ou même redirige vers un site web externe.

#### Fonctionnement

1. **Choisissez votre type :** Sélectionnez l’endroit où vous souhaitez que le clic emmène vos utilisateurs. Cela peut être une page d’enregistrement, une page personnalisée, un Flow ou une URL externe.
2. **Personnaliser le nom de l’action :** Lors de l’utilisation d’une interaction de navigation, choisissez le nom de l’action à appeler.

En utilisant la fonctionnalité Lien vers, votre groupe d’avatars devient plus qu’un simple affichage de visages ; il devient une passerelle vers des informations ou des actions supplémentaires.

***

## **Utilisation du composant Avonni Avatar Group**

Ces options de configuration vous permettent d’adapter le composant Avonni Avatar Group à vos besoins. Par exemple, vous pouvez mettre en avant les membres d’une équipe sur une page de projet, afficher des avatars de clients sur des pages de compte ou créer des listes visuellement attrayantes de membres de la communauté.

N’oubliez pas que le composant Avonni Avatar Group est très adaptable. Vous pouvez personnaliser davantage son apparence avec la mise en forme et l’apparence, et même ajouter des éléments interactifs pour rendre les avatars cliquables ou les lier à des profils d’utilisateurs.

En tirant parti du composant Avonni Avatar Group, vous pouvez créer une expérience plus personnalisée et plus informative pour les utilisateurs de votre site Experience Cloud, favoriser les connexions et mettre en valeur l’aspect humain au sein de votre communauté en ligne.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-fr/experience-components/ax-avatar-group.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
