Composants des widgets et microsites expliqués
Limité: Les composants, à l’exception de ceux fournis dans les modèles donnés, ne sont disponibles que pour certaines éditions de produit ou certains modules complémentaires. Si vous souhaitez un contrôle plus fin sur les composants utilisés par vos microsites, contactez-nous pour mettre votre programme à niveau.
Les composants sont les blocs de construction individuels, comme les images héro et les cartes de tâches, qui constituent le widget ou le microsite de votre programme Advocate. Ces éléments façonnent l’ l’expérience des participants et peuvent être personnalisés pour s’aligner sur votre marque.
Cet article fournit une liste catégorisée des composants disponibles dans les éditeurs de widget et de microsite. La plupart des composants prennent en charge le style et la personnalisation, bien que certains présentent des limites de conception. Vous pouvez également prévisualiser les états de vos composants dans l’interface de l’éditeur.
Statistiques
Utilisez Statistiques des composants pour permettre à vos participants de savoir comment ils se débrouillent dans votre programme. Pour une liste des statistiques que ces composants peuvent prendre en charge, consultez Statistiques du widget et du microsite.
Solde de points
Affiche le solde de points du participant. Utilisé dans les programmes Advocate qui récompensent les participants avec des points.
Cartes-cadeaux gagnées
Affiche le nombre de récompenses sous forme de cartes-cadeaux gagnées par l’Advocate.
Recommandations
Affiche le nombre de parrainages effectués par le participant. Inclut les parrainages initiés et convertis.
Conteneur avec trois statistiques
Un modèle avec de l’espace pour trois statistiques. Les statistiques affichées peuvent être modifiées. Des statistiques peuvent être ajoutées et supprimées selon les besoins.
Autre statistique
Affiche une statistique de votre choix. Vous pouvez choisir entre une statistique de parrainage, diverses statistiques de récompense ou créer une statistique personnalisée.

Composants courants
Composants courants sont largement utilisés pour améliorer à la fois la fonctionnalité et la cohérence du design dans votre widget ou microsite. Ils couvrent des éléments visuels et structurels à usage général comme les images héro, la mise en forme de la disposition et les étapes descriptives du programme.
Image héro en deux colonnes
Une image de bannière et un texte d’en-tête s’étendant sur deux colonnes. L’image, le texte et la couleur d’arrière-plan peuvent être mis à jour.

Image principale superposée
Une image de bannière avec du texte superposé. L’image, le texte et la couleur d’arrière-plan peuvent être mis à jour.

Image
Une image. La couleur d’arrière-plan, l’alignement, la hauteur et la largeur peuvent être modifiés.

Bouton de lien
Un bouton cliquable qui redirige les participants vers le lien que vous avez sélectionné. La couleur du bouton est contrôlée par la couleur de marque définie au niveau du conteneur de marque.
![]()
Explication du programme
Un modèle expliquant le fonctionnement d’un programme Advocate, par exemple comment gagner des récompenses. Inclut par défaut deux étapes d’explication du programme. D’autres étapes peuvent être ajoutées. La couleur est contrôlée par la couleur de marque définie au niveau du conteneur de marque.

Étape d’explication du programme
Ajoutez un texte descriptif pour expliquer une partie de votre programme. S’intègre dans un composant d’explication du programme. La couleur est contrôlée par la couleur de marque définie au niveau du conteneur de marque.

Chronologie du programme
Affichez un aperçu du parcours de parrainage et des récompenses pour vos participants. Ajoutez ou supprimez des entrées de la chronologie selon les besoins. La couleur de l’icône du cercle et des lignes entre les entrées est contrôlée par la couleur de marque définie au niveau du conteneur de marque.

Entrée de la chronologie
S’intègre dans un composant de chronologie du programme pour afficher une étape du parcours de parrainage. La couleur de l’icône du cercle et des lignes entre les entrées est contrôlée par la couleur de marque définie au niveau du conteneur de marque.

Affichage du nom d’utilisateur
Récupère dynamiquement le nom complet du participant. Par défaut, « Utilisateur anonyme » si le participant n’a pas saisi de nom.
![]()
Récompenses
Remarque : Récompense Les composants ne peuvent être utilisés que pour les widgets et microsites à accès vérifié.
Flux de cartes de tâches
Les cartes de tâches permettent à vos utilisateurs d’effectuer des actions ou de voir leur progression vers les objectifs du programme Advocate directement dans le widget ou le microsite. Ce composant ajoute plusieurs cartes de tâches à votre widget ou microsite. La couleur du bouton est contrôlée par la couleur de marque définie au niveau du conteneur de marque.

Échange de récompense
Permet aux participants d’échanger les récompenses gagnées contre un autre type de récompense.
Vous devez avoir Échange de récompense configuré pour utiliser cette fonctionnalité.

Tableau des récompenses
Affiche une liste des récompenses que le participant a gagnées. Peut inclure des récompenses manuelles et/ou des récompenses gagnées dans plusieurs programmes Advocate.

Colonne de note client
Ajoutez une autre colonne de note au tableau des récompenses. Doit être placée dans le composant du tableau des récompenses.

Colonne de date
Ajoutez une autre colonne de date au tableau des récompenses. Doit être placée dans le composant du tableau des récompenses.

Colonne de récompense
Ajoutez une autre colonne de récompense au tableau des récompenses. Doit être placée dans le composant du tableau des récompenses.

Colonne de source
Ajoutez une autre colonne de source au tableau des récompenses. Doit être placée dans le composant du tableau des récompenses.

Colonne de statut
Ajoutez une autre colonne de statut au tableau des récompenses. Doit être placée dans le composant du tableau des récompenses.

Composants du microsite
Microsite Les composants sont principalement utilisés pour le formulaire d’inscription et la barre latérale de navigation de votre microsite. Ces composants ne peuvent pas être ajoutés aux widgets du programme.
Champ de case à cocher du formulaire
Ajoutez une case à cocher au formulaire d’inscription. Vous pouvez faire correspondre l’état coché de la case à un champ personnalisé sur le participant Advocate. Consultez Afficher les soumissions de votre formulaire d’inscription au microsite pour plus d’informations.

Champ de liste déroulante du formulaire
Ajoutez une liste déroulante avec des éléments de liste personnalisables au formulaire d’inscription. Vous pouvez faire correspondre l’élément de liste sélectionné par l’utilisateur à un champ personnalisé sur le participant Advocate. Contactez l’assistance pour obtenir de l’aide à ce sujet.

Champ de saisie du formulaire
Ajoutez un champ de saisie de texte libre au formulaire d’inscription. Vous pouvez faire correspondre le texte saisi par l’utilisateur à un champ personnalisé sur le participant Advocate. Contactez l’assistance pour obtenir de l’aide à ce sujet.

Champs nom du formulaire
Ajoutez des champs Prénom et Nom à remplir au formulaire d’inscription.

Élément de barre latérale
Ajoutez une nouvelle page ou un nouveau lien à la navigation de la barre latérale de votre microsite. Peut uniquement être placé dans la mise en page Connecté du microsite.
![]()
Champ de mot de passe du formulaire
Ajoutez un champ de mot de passe à remplir au formulaire d’inscription.

Accès instantané
Accès instantané Les composants permettent aux amis parrainés de s’inscrire ou d’échanger des récompenses rapidement et facilement, sans passer par le processus d’inscription standard. Ils sont idéaux pour les programmes utilisant des widgets de parrainage à accès instantané ou des parcours d’inscription d’amis.
Code promo
Affiche un code échangeable pour une récompense Fuel Tank.
Le récompenses fuel tank doit disposer de codes promo disponibles pour que ce composant fonctionne comme prévu.

Inscription de l’Advocate
Permet aux nouveaux Advocates de saisir leur adresse e-mail pour s’inscrire et effectuer des parrainages. Après avoir saisi leur adresse e-mail, les utilisateurs seront dirigés vers un deuxième écran où ils pourront accéder à leurs liens de partage de parrainage. Utilisé pour le widget de parrainage de site Web à accès instantané.

Déconnecter l’utilisateur actuel
Permet au visiteur de quitter l’affichage personnalisé à accès instantané.
![]()
Inscription d’un ami
Permet aux amis parrainés de saisir leur adresse e-mail pour s’inscrire. Après avoir saisi leur adresse e-mail, les utilisateurs seront dirigés vers un deuxième écran où ils pourront accéder à leur récompense Code promo. Utilisé pour le widget Ami à accès instantané.

Disposition
Disposition Les composants permettent d’organiser et de regrouper d’autres composants. Utilisez-les pour créer des sections, des lignes, des colonnes ou des onglets.
Disposition héro en deux colonnes
Ajoutez une mise en page héro avec deux colonnes de contenu.

Conteneur de mise en page en ligne
Ajoutez un nouveau conteneur de ligne pour le contenu. D’autres composants peuvent être placés dans la ligne.

Conteneur de mise en page en colonne
Ajoutez un nouveau conteneur de colonne pour le contenu. D’autres composants peuvent être placés dans la colonne.

Onglet
Ajoutez un nouvel onglet à un groupe d’onglets générique.

Groupe d’onglets générique
Ajoutez un groupe d’onglets. Chaque onglet peut contenir des composants et du contenu distincts. Il comporte trois onglets par défaut, mais des onglets peuvent être supprimés ou ajoutés selon les besoins.

Section inclinée
Ajoutez une nouvelle section contenant un titre et un paragraphe. D’autres composants peuvent être ajoutés à la section Titre sous l’en-tête.

Factures
Facture Les composants vous permettent d’insérer des composants de facture pour consulter les données de gains.
Tableau des factures
Ajoutez un accordéon de facture extensible qui contient des données de gains.

Colonne de date du tableau des factures
Ajoutez une nouvelle colonne à votre composant de tableau des factures.

Le Classement Le composant permet de classer les participants à votre programme, d’offrir des récompenses aux meilleurs performeurs et d’inciter les participants à obtenir de meilleurs résultats dans votre programme. Ajoutez des classements à votre widget à accès vérifié ou microsite, et configurez le système de score, le système de classement et les options de filtrage des participants. Consultez les articles ci-dessous pour plus d’informations :
Parrainage initié
Ce type de classement classe les participants selon le nombre de parrainages qu’ils ont initiés. Les scores de vos advocates clients correspondront au nombre de parrainages initiés.

Parrainage converti
Ce type de classement classe les participants selon le nombre de parrainages qu’ils ont convertis. Les parrainages sont considérés comme convertis une fois que l’ami parrainé atteint un objectif du programme, par exemple effectuer un achat d’une valeur que vous avez définie. Les scores de vos advocates clients correspondront au nombre de parrainages convertis.

Points gagnés
Ce type de classement classe les participants selon le nombre total de points qu’ils ont gagnés dans les programmes Advocate qui récompensent avec des points. Tous les points de récompense comptent tant qu’ils ne sont ni en attente ni annulés. Ce type de classement n’est valable que pour le type de récompense Point.

Classement anonyme
Une version entièrement anonymisée du classement qui n’affiche aucune information personnellement identifiable sur les autres participants au programme. Peut afficher n’importe quel type de classement.

Taxes et espèces
Taxes et espèces Les composants vous permettent d’intégrer la collecte de formulaires fiscaux et les options de versement en espèces dans votre widget à accès vérifié ou microsite.
Ce groupe de composants n’est disponible que si la paiements en espèces fonctionnalité a été activée pour votre compte.
Fenêtre modale d’informations du partenaire
Insérez une fenêtre modale qui collecte le pays et la devise des participants. Ces informations garantissent que vos participants peuvent recevoir leurs récompenses sans retard ni étapes de configuration supplémentaires.
Elle comporte deux états configurables selon que l’adresse e-mail du participant est déjà liée à un compte existant :
Description du nouveau partenaire: Affichée aux participants pour la première fois. Le texte par défaut (« Confirmez votre pays et votre devise maintenant pour recevoir vos futures récompenses plus rapidement ») les invite à fournir leurs coordonnées avant de recevoir leur lien de partage.
Description du partenaire existant: Affichée lorsque l’adresse e-mail du participant est déjà associée à un compte sur impact.com. La fenêtre modale préremplit ses informations et lui demande de les confirmer plutôt que de les ressaisir de zéro.
Alerte d’état du paiement
Alertez le participant sur les actions qu’il doit effectuer avant de pouvoir recevoir un paiement en espèces. Le composant comprend un bouton d’appel à l’action qui amène le participant à consulter ses paramètres de paiement.
Vous pouvez également personnaliser, si vous le souhaitez, les descriptions textuelles que le participant verra lorsqu’il consultera le composant.

Formulaire de versement en espèces pour le microsite et le widget
Insérez un formulaire qui collecte les informations bancaires des participants ainsi que tous les formulaires fiscaux applicables, comme un W-8 ou un W-9.
Vous pouvez également personnaliser, si vous le souhaitez, les descriptions textuelles que le participant verra lorsqu’il consultera le formulaire.
Vous pouvez également définir des alertes et des exigences de vérification dans ce composant.

Partage
Partage Les composants offrent aux participants des moyens pratiques de promouvoir leurs liens et codes de parrainage sur plusieurs canaux. Lorsqu’un participant clique sur un bouton de partage, cela ouvre le canal choisi, comme Facebook, LinkedIn, WhatsApp, ou e-mail, avec un message ou un lien prérempli, prêt à être envoyé.
Certains composants, comme Code de parrainage, affichent le code de parrainage ou promotionnel individuel du participant avec une option de copie dans le presse-papiers pour un partage rapide. D’autres, comme Codes promo, présentent plusieurs codes disponibles (s’ils sont attribués) dans une vue en carrousel, et incluent des boutons de partage afin que les participants puissent publier ou envoyer instantanément le code sélectionné. Ces outils permettent aux participants de faire facilement passer le mot et de générer de nouveaux parrainages.
Code de parrainage
Affiche un champ de code de parrainage avec une option de copie dans le presse-papiers. Utilisé dans le cadre de la fonctionnalité Codes promo.

Codes promo
Bloc de composant préformaté qui inclut un champ de code promotionnel de parrainage avec un curseur permettant de passer d’un code à l’autre si plusieurs ont été attribués. Il inclut également un lien de partage, ainsi que des composants de boutons de partage Facebook, LinkedIn et Twitter / X.

Bouton de partage Facebook
Affiche un bouton Partager sur Facebook avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers une nouvelle publication sur le profil Facebook de l’utilisateur avec la messagerie sociale de la marque préchargée.

Bouton de partage X
Affiche un bouton Partager via X avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers une nouvelle publication sur le compte X de l’utilisateur avec la messagerie sociale de la marque préchargée.

Bouton de partage par e-mail
Affiche un bouton Partager par e-mail avec du texte personnalisable. Lorsqu’on clique dessus, le bouton ouvre l’application de messagerie par défaut de l’utilisateur et crée un nouvel e-mail avec la messagerie sociale de la marque préchargée.

Bouton de partage de la feuille de partage mobile
Affiche un bouton de partage dans le navigateur web du participant. Lorsqu’on clique dessus, le bouton ouvre un menu répertoriant toutes les applications disponibles que l’utilisateur peut ouvrir pour partager son lien. Lorsqu’une application est sélectionnée, une nouvelle publication ou un nouveau message est créé avec la messagerie sociale de la marque préchargée.

Bouton de partage LinkedIn
Affiche un bouton Partager sur LinkedIn avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers une nouvelle publication sur le profil LinkedIn de l’utilisateur avec la messagerie sociale de la marque préchargée.

Bouton de partage SMS
Affiche un bouton Envoyer à un ami avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers l’application SMS/messagerie texte par défaut de l’utilisateur, et un nouveau SMS/message texte est créé avec la messagerie sociale de la marque préchargée.

Bouton de partage Messenger
Affiche un bouton Partager via Messenger avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers un nouveau message dans l’application Facebook Messenger de l’utilisateur avec la messagerie sociale de la marque préchargée.

Bouton de partage WhatsApp
Affiche un bouton Partager via WhatsApp avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers un nouveau message sur le compte WhatsApp de l’utilisateur avec la messagerie sociale de la marque préchargée.

Bouton de partage LINE
Affiche un bouton Partager via Line Messenger avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers un nouveau message dans l’application Line Messenger de l’utilisateur avec la messagerie sociale de la marque préchargée.

Bouton de partage Pinterest
Affiche un bouton Partager sur Pinterest avec du texte personnalisable. Lorsqu’on clique dessus, le bouton redirige vers une nouvelle publication sur le profil Pinterest de l’utilisateur avec la messagerie sociale de la marque préchargée.

Lien de partage
Affichez le lien de partage du participant pour ce programme.

Code QR
Affichez le lien de partage du participant sous la forme d’un code QR pour ce programme.

Recommandations
Parrainage Les composants affichent des informations sur les amis parrainés du participant et leur statut de conversion. Ils permettent aux participants de suivre facilement qui ils ont parrainé, quand les conversions ont eu lieu et quelles récompenses ont été gagnées grâce à ces parrainages.
Carte de parrainage
Bloc de composant préformaté qui inclut la chronologie du programme, le lien de partage, et Facebook, LinkedIn, et Twitter / X composants de bouton de partage. Peut ajouter ou supprimer d’autres composants selon les besoins.

Tableau des parrainages
Affiche un tableau montrant les amis parrainés du participant, la date de conversion et le statut de conversion.

Colonne de date du tableau des parrainages
Ajoutez une autre colonne de date au tableau des parrainages. Doit être placée dans le composant du tableau des parrainages.

Colonne des récompenses du tableau des parrainages
Ajoutez une autre colonne de récompenses au tableau des parrainages. Doit être placée dans le composant du tableau des parrainages.

Colonne de statut du tableau des parrainages
Ajoutez une autre colonne de statut au tableau des parrainages. Doit être placée dans le composant du tableau des parrainages.

Colonne utilisateur du tableau des parrainages
Ajoutez une autre colonne client (ami parrainé) au tableau des parrainages. Doit être placée dans le composant du tableau des parrainages.

Avancé
Les composants avancés vous donnent un contrôle plus poussé sur ce que les participants voient et quand ils le voient. Ils permettent l’affichage conditionnel du contenu, les remplacements de programme et d’autres configurations spécialisées qui aident à adapter l’expérience à des publics spécifiques.
Zone conditionnelle / Segment
Affichez le contenu de cette section uniquement lorsque le participant appartient à un certain segment d’utilisateurs.
Pour définir le segment utilisateur, ouvrez les propriétés du composant et modifiez l’expression JSONata dans le Condition champ.
Les utilisateurs appartenant au segment défini verront tout le contenu affiché dans la section conditionnelle, tandis que les utilisateurs qui n’y appartiennent pas ne verront pas le contenu.

Zone conditionnelle / Champ
Affichez le contenu de cette section uniquement lorsqu’un champ personnalisé sur le profil du participant contient une certaine valeur.
Pour définir le nom et la valeur du champ personnalisé, ouvrez les propriétés du composant et modifiez l’expression JSONata dans le Condition champ.
Les utilisateurs ayant la bonne valeur de champ personnalisé verront tout le contenu affiché dans la section conditionnelle, tandis que les utilisateurs n’ayant pas la bonne valeur de champ personnalisé ne verront pas le contenu.

Section du programme
Le composant de section du programme vous permet de remplacer l’ID du programme de ses composants enfants. Utilisez-le lorsque vous souhaitez afficher du contenu qui n’est pas lié à un programme spécifique. Inclus par défaut dans la plupart des modèles de widget et de microsite.

Mis à jour
Ce contenu vous a-t-il été utile ?


