Introduction
Le branding concerne la modification des différents aspects visuels de votre programme et se divise en 3 parties : l'apparence générale, la page fidélité et le module compte client.
💡 Pour rappel, l'objectif est d'avoir une page sur votre site où vos clients pourront retrouver votre programme de fidélité et de parrainage.
Vous avez la possibilité de personnaliser cette page en ajustant les titres, les descriptions ou encore l'ordre d'affichage, permettant ainsi une adaptation complète à vos préférences et à l'identité de votre marque.🌟
L'apparence générale
Vous allez pouvoir modifier l’apparence globale de vos espaces utilisateurs.
Cette section se divise en 3 parties :
La typographie
La typographie vous permet de modifier les polices de votre programme.
✨ Suivez notre guide pour modifier les typographies.
Le bouton de connexion, d'inscription & de retour
Choisissez le texte du bouton et personnalisez son apparence.
Vous pouvez :
définir la taille et la graisse du texte,
choisir la couleur du texte et du fond,
configurer les couleurs au survol
ajuster le rayon des angles.
Pour une personnalisation avancée, utilisez un fichier CSS personnalisé. Retrouvez toutes les étapes dans notre guide.
La page fidélité
La page constitue le cœur de votre branding, offrant une vitrine claire et attractive des missions et programmes que vous proposez. Grâce à une personnalisation complète des titres, descriptions, images, et couleurs, cette page devient le reflet fidèle de l'identité de votre marque.
💡 L'ajout de la page se fait en un click depuis l'onglet Communication - Diffusion. Suivez notre guide pour référencer votre page !
Vous pouvez choisir de masquer les modules ou réorganiser les sections dans l'ordre que vous souhaitez.
La bannière
Sélectionnez l'agencement des textes sur la bannière selon vos préférences. Optez pour une image spécifique, adaptée à un affichage sur ordinateur ou mobile. Vous avez également la liberté de personnaliser intégralement les textes de la bannière.
1. Disposition
Définissez l’agencement général de la section.
2. Apparence de la section
Image – Desktop Glissez-déposez une image ou téléchargez-en une. (Taille recommandée : 1440 × 500 px)
Image – Mobile
Glissez-déposez une image ou téléchargez-en une. (Taille recommandée : 1440 × 500 px)
Couleur de la section Choisissez la couleur d’arrière-plan de la section.
3. Textes
Titre
Titre
Texte
Choisissez le texte du titre et définissez ses paramètres d’affichage.
Vous pouvez :
aligner le texte
choisir la couleur et la taille du texte
Définir la taille du texte
Choisir la graisse de la police
Description
Description
Texte
Choisissez le texte de la description et définissez ses paramètres d’affichage.
Vous pouvez :
aligner le texte
choisir la couleur et la taille du texte
Choisir la graisse de la police
Le profil
Personnalisez la section profil de l'utilisateur en modifiant le texte, la couleur, et la taille à votre convenance. Ajustez également la taille des boutons de réseaux sociaux pour une meilleure intégration avec le reste de l'interface.
Apparence de la section – Réseaux Sociaux
Apparence de la section – Réseaux Sociaux
Choisissez le texte du bouton et personnalisez son apparence.
Vous pouvez :
aligner le texte
choisir la couleur et la taille du texte
définir la graisse
sélectionner la couleur de fond de la section.
Boutons réseaux sociaux
Boutons réseaux sociaux
Personnalisez les boutons de vos réseaux sociaux
Vous pouvez :
définir la taille et la graisse du texte
choisir la couleur du texte et du fond,
configurer les couleurs du texte et du fond au survol
ajuster le rayon des angles.
Les étapes
Apportez des modifications à la section des étapes, que ce soit pour les utilisateurs connectés ou non. Vous avez la possibilité de changer les textes et de reformater leur présentation selon vos besoins.
Apparence de la section
Apparence de la section
Couleur de la section
Personnalisez la couleur de fond de la section.
Mode non connecté
Mode non connecté
Numéro
Personnalisez le numéro de l’étape.
Vous pouvez :
définir la couleur et la taille du texte
Choisir la graisse de la police
Titre
Personnalisez le titre principal de la section.
Vous pouvez :
définir la couleur et la taille du texte
Choisir la graisse de la police
Description
Personnalisez la description de la section pour guider l’utilisateur.
Vous pouvez :
définir la couleur et la taille du texte
Choisir la graisse de la police
Étape 1 / Étape 2 / Étape 3
Vous pouvez :
personnaliser le numéro de l’étape
ajouter ou modifier le titre de l’étape
ajouter ou modifier la description de l’étape
Mode connecté
Mode connecté
Titre
Personnalisez le titre principal affiché à l’utilisateur connecté.
Vous pouvez :
modifier le texte,
choisir la couleur a taille du texte
Choisir la graisse de la police
Sous-titre
Personnalisez le sous-titre pour afficher le nombre de points de l’utilisateur.
Vous pouvez :
modifier le texte,
choisir la couleur et la taille du texte
Choisir la graisse de la police
Bouton “Mes récompenses”
Personnalisez le bouton pour accéder aux récompenses.
Vous pouvez :
modifier le texte
ajuster la taille du texte et la graisse
choisir la couleur du texte et du fond
configurer la couleur du texte et du fond au survol
ajuster le rayon des angles pour arrondir le bouton.
Bouton “Mes activités récentes”
Personnalisez le bouton pour accéder aux activités récentes de l’utilisateur.
Vous pouvez :
modifier le texte
ajuster la taille du texte et la graisse
choisir la couleur du texte et du fond
configurer la couleur du texte et du fond au survol
ajuster le rayon des angles.
Les sections de la page fidélité
Ré-agencez la section dédiée au parrainage, aux missions, aux récompenses et aux paliers VIP, test produits et carte de fidélité pour qu'elle s'harmonise avec l'esthétique et la fonctionnalité de votre programme.
Les missions, les récompenses et les test produits
Disposition
Disposition
Organisez la structure de la section et ajustez l'apparence générale
Apparence de la section
Apparence de la section
Texte
Personnalisez le texte de cette section pour expliquer aux utilisateurs comment obtenir des points.
Vous pouvez :
aligner le texte
choisir la couleur du texte
ajuster la taille du texte et la graisse
définir la couleur de fond de la section
Carte “Mission”
Carte “Mission”
Personnaliser l’apparence de la carte de mission.
Vous pouvez :
définir la couleur du fond
configurer la couleur au survol
ajuster le rayon des angles
choisir la couleur des contours
Nombre de points
Vous pouvez personnaliser l’affichage du nombre de points.
Vous pouvez :
choisir la couleur du texte
définir la couleur du texte au survol
ajuster la taille du texte et la graisse de la police
Nom de la mission
Vous pouvez personnaliser l’affichage du nom de la mission.
Vous pouvez :
choisir la couleur du texte
définir la couleur du texte au survol
ajuster la taille du texte
définir la graisse.
Bouton
Bouton
Personnaliser l’apparence du bouton.
Vous pouvez :
ajuster la taille du texte
Choisir la graisse de la police
choisir la couleur du texte
sélectionner la couleur du fond
configurer la couleur du texte au survol
configurer la couleur du fond au survol
ajuster le rayon des angles.
Le parrainage
1.Section parrainage (client)
Disposition de la Section
Organisez la structure de la section
Apparence de la section
Apparence de la section
Personnalisez l’apparence générale de la section.
Vous pouvez :
ajouter une image Desktop (taille recommandée : 1920 × 960 px) en la faisant glisser ou en la téléchargeant,
ajouter une image Mobile (taille recommandée : 960 × 1920 px) en la faisant glisser ou en la téléchargeant,
choisir la couleur de la section.
Apparence de la carte
Apparence de la carte
Vous pouvez personnaliser l’apparence générale, le titre et la description de la carte.
Vous pouvez :
aligner le texte
définir la couleur du fond
configurer la couleur au survol
ajuster le rayon des angles
choisir la couleur des contours.
Icônes de Partage
Icônes de Partage
Faites glisser une image ou téléchargez-la pour l'icône.
Lien
E-mail
SMS
WhatsApp
Messenger
X
Bouton
Bouton
Personnalisez l’apparence du bouton.
Vous pouvez :
définir la taille du texte
choisir la graisse de la police
définir la couleur du texte et du fond
définir la couleur du texte et du fond au survol
Choisir le rayon des angles.
Carte "Non connecté" / Carte "Partage" / Carte "Félicitations"
Carte "Non connecté" / Carte "Partage" / Carte "Félicitations"
Personnalisez le contenu de la carte.
Vous pouvez :
définir le titre de la carte
définir le texte de la description
définir le texte du bouton
3. Section : Modale Parrainage (ami.e)
Les étapes de configuration sont les mêmes que pour les autres sections, y compris :
Modale “Vérification”
Modale “Succès”
Modale “Erreur”
Personnalisez le contenu de la carte.
Vous pouvez:
définir le titre de la carte
définir le texte de la description
définir le texte du bouton
Carte de fidélité
Disposition de la Section
Disposition de la Section
Organisez la structure de la section
Apparence de la section
Apparence de la section
Vous pouvez définir l’apparence générale de la section :
utiliser une image dynamique,
ajouter une image personnalisée,
choisir la couleur de la section.
Textes " Loyalty Card"
Textes " Loyalty Card"
Titre
Personnalisez le titre et la description de la section.
Vous pouvez:
aligner le texte
définir la couleur du texte
définir la taille et la graisse du texte
Description
aligner le texte
définir la couleur du texte
définir la taille et la graisse du texte
Le compte client
Intégrer le module de compte client au-dessus ou en dessous des commandes du client est important pour plusieurs raisons. Cela permet à vos clients de connaître leur nombre de points et d'accéder au programme rapidement. La visibilité accrue des points de fidélité encourage les clients à tirer parti de leurs points, en réclamant des récompenses.
Vous pouvez modifier l'apparence de la section, en choisissant une image desktop ou mobile et en modifiant l'ensemble des textes.
Navigation & apparence
Arrière-plan de la section
Arrière-plan de la section
Personnalisez l’arrière-plan de la section
Vous pouvez :
ajouter une image pour la version desktop (540 × 150)
ajouter une image pour la version mobile (360 × 290)
définir la couleur du bloc
choisir la couleur de la navigation
sélectionner la couleur de la section
ajuster le rayon des angles.
Section
Section
texte
Personnalisez le contenu de la section
Vous pouvez :
définir le titre de la section
aligner les textes
personnaliser la couleur, la taille et la graisse du texte.
Points
Personnalisez l’affichage des points
Vous pouvez :
personnaliser la nomination des points
personnaliser la couleur, la taille et la graisse du texte.
Menu
Menu
Titre
Personnalisez le contenu de la section
Vous pouvez :
définir les titres du menu (Fidélité, Récompenses, Parrainage)
ajouter une image pour chaque entrée
Menu actif
Personnalisez le menu actif
Vous pouvez :
définir la taille du texte et la graisse du texte
sélectionner la couleur du texte et du fond
configurer les couleurs du texte et du fond au survol
ajuster le rayon des angles.
Menu inactif
Personnalisez le menu inactif
Vous pouvez :
définir la taille du texte et la graisse du texte
sélectionner la couleur du texte et du fond
configurer les couleurs du texte et du fond au survol
ajuster le rayon des angles.
Fidélité
Format de la carte
Format de la carte
Personnalisez le format de la carte
Vous pouvez :
choisir le format Carte à points
sélectionner l’affichage en bandeau
adapter la présentation de la carte à points.
Bloc fidélité
Bloc fidélité
Titre de la section
Personnalisez le titre de la section
Vous pouvez :
personnaliser le texte principal
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Paliers VIP
Personnalisez les paliers VIP
Vous pouvez :
définir le texte des paliers VIP
aligner les textes
personnaliser la couleur, la taille et la graisse du texte.
Description
Personnalisez la description
Vous pouvez :
définir le texte de description
aligner les textes
personnaliser la couleur, la taille et la graisse du texte.
Bouton
Bouton
Personnalisez le bouton
Vous pouvez :
définir le texte du bouton
choisir la taille et la graisse du texte
sélectionner la couleur du texte et du fond
configurer les couleurs du texte et du fond au survol
ajuster le rayon des angles.
Style de la carte
Style de la carte
Personnalisez le style de la carte
Vous pouvez :
choisir le style de la carte
sélectionner le style d'affichage (Simple/ Palier VIP/ Récompense à venir)
Personnalisation de la carte
Personnalisation de la carte
Personnalisez la carte fidélité
Vous pouvez :
définir la couleur de la carte
ajuster le rayon des angles.
Nombre de points
Personnalisez l’affichage du nombre de points
Vous pouvez :
choisir la couleur du texte
définir la taille du texte
sélectionner la graisse du texte.
Nomination des points
Personnalisez la nomination des points
Vous pouvez :
choisir la couleur du texte
définir la taille du texte
sélectionner la graisse du texte.
Palier VIP
Personnalisez le palier VIP
Vous pouvez :
définir la couleur du texte
choisir la couleur de fond
configurer la couleur de la progression
sélectionner la couleur du point.
Récompenses
Titre de la section
Titre de la section
Personnalisez le titre de la section
Vous pouvez :
définir le titre de la section
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Personnalisez la description
Vous pouvez :
définir le texte de description
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Carte "récompense"
Carte "récompense"
Personnalisez les cartes « Récompense »
Vous pouvez :
définir la couleur du fond de la carte
choisir la couleur au survol
ajuster le rayon des angles
sélectionner la couleur des contours.
Personnalisez le nom de la récompense
Vous pouvez :
aligner les textes
choisir la couleur du texte
configurer la couleur du texte au survol
définir la taille et la graisse du texte.
Personnalisez l’affichage du nombre de points
Vous pouvez :
aligner les textes
choisir la couleur du texte
configurer la couleur du texte au survol
définir la taille et la graisse du texte.
Bouton " récompense"
Bouton " récompense"
Personnalisez le bouton
Vous pouvez :
définir le texte du bouton
choisir la taille et la graisse du texte
sélectionner la couleur du texte et du fond
configurer les couleurs du texte et du fond au survol
ajuster le rayon des angles.
Parrainage
Bloc parrainage
Bloc parrainage
Personnalisez le bloc parrainage
Vous pouvez :
définir le texte de la section
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Personnalisez le titre du parrainage
Vous pouvez :
définir le texte du titre
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Personnalisez la description
Vous pouvez :
définir le texte de description
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Personnalisez le bouton de parrainage
Vous pouvez :
définir le texte du bouton
choisir la taille et la graisse du texte
sélectionner la couleur du texte et du fond
configurer les couleurs du texte et du fond au survol
ajuster le rayon des angles.
Icône ”Partage”
Icône ”Partage”
Personnalisez les icônes de partage
Vous pouvez :
ajouter une icône pour le lien
ajouter une icône pour l’e-mail
ajouter une icône pour le SMS
ajouter une icône pour WhatsApp
ajouter une icône pour Messenger
ajouter une icône pour X.
Bloc ”Félicitations”
Bloc ”Félicitations”
Personnalisez le bloc « Félicitations »
Vous pouvez :
définir le titre du bloc
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Personnalisez la description
Vous pouvez :
définir le texte de description
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Personnalisez le bouton
Vous pouvez :
définir le texte du bouton
choisir la taille et la graisse du texte
sélectionner la couleur du texte et du fond
configurer les couleurs du texte et du fond au survol
ajuster le rayon des angles.
Carte de fidélité
Apparence de la section
Apparence de la section
Personnalisez l’apparence de la section
Vous pouvez :
Ajouter une image personnalisée (320 × 230);
Textes
Textes
Personnalisez les textes
Vous pouvez :
définir le titre
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Personnalisez la description
Vous pouvez :
définir le texte de description
aligner les textes
choisir la couleur, la taille et la graisse du texte.
Bravo, vous avez mis en place votre branding : cela permettra à vos utilisateurs de vivre une expérience unique. 🌟
💡 Vous pouvez prévisualiser les différents modules sous format desktop ou mobile en cliquant sur les icônes en haut à droite.