YouTube ChannelSchedule a CallSubscribe for Updates
Page cover

AX - Avatar

Aperçu

AX - Avatar est un composant Experience Cloud qui affiche des photos de profil, des initiales ou des icônes sur les pages des sites Experience pour représenter des utilisateurs, des contacts, des comptes ou n'importe quel enregistrement Salesforce.

Utilisez-le pour afficher les profils des utilisateurs du portail, les représentants de comptes, les listes de contacts ou les identifiants d'entité avec un style visuel cohérent. Le composant affiche automatiquement les images lorsqu'elles sont disponibles ou bascule vers les initiales ou les icônes.

Parfait pour les en-têtes de profil utilisateur, les listes de membres de la communauté, les annuaires de contacts ou tout endroit où les utilisateurs du portail ont besoin d'une identification visuelle des personnes ou des entités.

Personnalisation de l'Avatar

Le composant Avonni Avatar vous aide à créer des représentations visuelles cohérentes des utilisateurs ou des entités au sein de votre site Salesforce Experience Cloud. Voici un guide étape par étape pour personnaliser l'Avatar selon vos besoins :

Affichage des initiales

Le composant Avatar offre de la flexibilité dans la façon d'afficher les initiales :

Saisie manuelle

Si vous connaissez les initiales que vous souhaitez afficher, saisissez-les directement dans le champ "Initiales".

Génération dynamique (Expressions)

Pour rendre vos composants Avonni dynamiques, vous pouvez utiliser Expressions Experience Cloud. Par exemple, dans le composant Avatar ci‑dessous, vous pouvez utiliser l'expression suivante pour afficher automatiquement le nom de l'utilisateur actuellement connecté :

{!User.Record.Name}

Vous pouvez remplacer Nom par le nom réel du champ contenant le nom de l'utilisateur dans votre organisation Salesforce.

Si vous souhaitez générer automatiquement des initiales à partir d'un nom complet, activez l'option "Initiales formatées automatiquement". Cela utilisera des expressions Experience Cloud pour extraire et formater la première lettre de chaque mot du nom.

Affichage dynamique des initiales à partir du nom de l'utilisateur actuel

Image personnalisée

Ajoutez une photo de profil, un logo ou toute image pour rendre l'Avatar immédiatement reconnaissable. Téléchargez votre image en utilisant l'option Contenu sélectionné — le composant la recadre et la formate automatiquement pour qu'elle s'adapte à la forme de l'Avatar.

Si aucune image n'est ajoutée, l'Avatar affiche à la place les initiales

Variant (forme)

Choisissez entre cercle ou carré en utilisant le champ Variante pour correspondre au design de votre portail. Les avatars circulaires conviennent bien aux personnes, tandis que les formes carrées conviennent aux logos ou aux icônes d'entité

Taille

Contrôlez la taille de l'Avatar sur la page en utilisant la Taille propriété. Les options vont de x-small à xx-large, afin que vous puissiez l'équilibrer avec le contenu environnant — plus petit pour des listes en ligne, plus grand pour les en-têtes de profil.

Texte principal et secondaire

Affichez un contexte supplémentaire à côté de l'Avatar en ajoutant des champs de texte. Utilisez Texte principal pour l'information la plus importante (comme un nom complet) et Texte secondaire pour les détails complémentaires (comme le poste ou l'e-mail).

Vous pouvez également définir les styles de police pour chaque niveau de texte afin de créer une hiérarchie visuelle entre les informations principales et secondaires.

Etiquettes

Ajoutez des libellés visuels pour catégoriser ou mettre en évidence des informations concernant l'Avatar. Les étiquettes apparaissent comme de petits badges et peuvent être stylisées avec différentes couleurs via l'option Variante d'étiquette — utile pour afficher le statut, le département, le rôle ou tout identifiant rapide.

Exemples d'utilisation

Profils utilisateur – Créez des en-têtes de profil complets en combinant une image personnalisée avec un texte principal pour le nom de l'utilisateur et un texte secondaire pour son poste ou son département. Cela offre aux utilisateurs du portail une représentation claire et professionnelle sur leurs pages de profil.

Forums communautaires – Affichez des Avatars à côté des publications et des commentaires afin que les membres de la communauté puissent rapidement identifier qui contribue. Cela ajoute une touche personnelle qui encourage l'engagement et facilite le suivi des conversations.

Pages d'équipe – Mettez en valeur les membres de l'équipe avec des Avatars incluant noms, rôles et étiquettes pour le département ou l'expertise. Cela aide les utilisateurs du portail à trouver le bon contact et à comprendre la structure de l'équipe en un coup d'œil.

Spécifications

Nom
Description

Initiales

Saisissez des initiales spécifiques à afficher dans l'Avatar. Cela vous permet de définir manuellement les lettres représentatives pour un utilisateur ou une entité

Initiales formatées automatiquement

Cette fonctionnalité génère et affiche automatiquement des initiales à partir d'un nom complet fourni, garantissant une représentation cohérente sans saisie manuelle

Nom de l'icône de secours

Détermine l'icône de secours à afficher dans l'Avatar lorsque les données principales (comme une image ou des initiales) sont absentes, assurant une continuité visuelle

Taille

Ajustez les dimensions globales de l'Avatar pour l'adapter à différents contextes d'interface utilisateur

Variante

Choisissez entre une forme circulaire (cercle) ou carrée (carré) pour l'Avatar afin de vous aligner sur vos préférences de conception

Masquer les détails de l'Avatar

Basculer pour afficher ou masquer les détails supplémentaires associés à l'Avatar, tels que les textes ou les étiquettes

Texte principal

Le texte principal affiché à côté de l'Avatar, souvent utilisé pour les noms ou les identifiants principaux

Style du texte principal

Désignez le style de police pour le texte principal, en choisissant parmi des options comme Titre 1-4 ou Paragraphe 1-2

Texte secondaire

Texte supplémentaire affiché sous le texte principal, adapté aux informations complémentaires ou aux sous-titres

Style du texte secondaire

Définissez le style de police pour le texte secondaire, avec des choix allant de Titre 1-4 à Paragraphe 1-2

Texte tertiaire

Texte de troisième niveau, généralement utilisé pour des détails supplémentaires ou des attributs liés à l'Avatar

Style du texte tertiaire

Choisissez le style de police souhaité pour le texte tertiaire, avec des options incluant Titre 1-4 et Paragraphe 1-2

Position du texte

Spécifiez l'alignement ou le positionnement des textes accompagnant l'Avatar, permettant une meilleure mise en page visuelle

Etiquettes

Définissez les propriétés pour les badges d'étiquette associés à l'Avatar, fournissant un moyen d'ajouter des marqueurs ou des indicateurs catégoriels à vos Avatars

Mis à jour

Ce contenu vous a-t-il été utile ?