> For the complete documentation index, see [llms.txt](https://docs.thewalletcrew.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.thewalletcrew.io/configure/fr/advanced-configuration/wallet/template-configuration/cards-design-colors-images-and-fields.md). # Conception des cartes (couleurs, images et champs) Concevez la carte elle-même : couleurs d’arrière-plan et de texte, logo et image centrale, disposition des champs, informations supplémentaires et liens. ## Conception de la carte Une carte est conçue pour simplifier l’expérience en magasin des clients et pour correspondre à l’identité de la marque. ### **Conception graphique** La section « Conception graphique » contrôle les images sur la carte et sa couleur, ce qui permet à la carte de se rapprocher autant que possible de la charte graphique de l’entreprise. #### **Couleur de la carte** Pour ajuster la couleur de la carte : 1. Appuyez sur la case du code couleur et sélectionnez la couleur souhaitée pour l’arrière-plan de la carte ;

Card background color picker in the Graphic design section — Vérifiez que la couleur de fond sélectionnée correspond à la référence de la marque.

2. Si nécessaire, modifiez les couleurs de l’en-tête et du texte sur la carte en déplaçant les curseurs vers la droite et en suivant les mêmes étapes pour la sélection des couleurs (uniquement pour les cartes dans Apple Wallet) ;

Header and text color sliders, available for Apple Wallet cards only — Vérifiez que l’en-tête et le texte restent lisibles sur le fond choisi.

3. Vérifiez la couleur sur les cartes situées à droite de l’interface.

Card preview panel on the right side of the template editor — Le panneau d’aperçu est l’endroit où les couleurs doivent être confirmées avant l’enregistrement.

❗ Veuillez noter : lorsque l’entreprise dispose d’une couleur de marque, saisissez son code dans la zone à côté de la case colorée. Cela donne la couleur exacte. Veuillez noter que la couleur de la carte peut être uniquement une couleur unie.

Saisissez ici le code couleur exact plutôt que de choisir la teinte à l’œil.

#### **Images sur la carte** Deux images peuvent être placées sur la carte en même temps : le logo de l’entreprise et l’image centrale.

Confirmez que chaque image se trouve dans l’emplacement prévu avant l’enregistrement.

**Carte Apple Wallet** 1. Téléversez le logo dans la section appropriée. Le format de fichier privilégié est PNG (avec fond transparent), 480 x 150 px ;2. Téléversez l’image centrale dans la section appropriée. Format de fichier PNG privilégié, 1125 x 432 px. **Carte Google Wallet** 1. Téléversez le logo dans la section appropriée. De préférence au format PNG (avec la même couleur de fond que la couleur de la carte), taille minimale 820 x 820 px ;2. Téléversez l’image centrale dans la section appropriée. Format de fichier PNG privilégié, 1032 x 336 px. ❗ Veuillez noter : les zones d’image peuvent être agrandies et déplacées à la souris afin de les sélectionner plus précisément. #### **Disposition des champs** La section « Disposition des champs » sélectionne les informations qui seront affichées sur la carte du client. Pour ajouter des champs à la carte : 1. Sélectionnez des champs dans la liste déroulante ; 2. Vérifiez la disposition des champs sur les cartes à droite de l’interface ; 3. Cliquez sur Enregistrer. Les champs de la carte affichent les informations provenant des variables créées pour le modèle et présentent les informations pertinentes pour le client. Les informations contenues dans les champs sont mises à jour automatiquement. #### **Informations supplémentaires** La section « Informations supplémentaires » peut contenir toutes les informations nécessaires pour le client, telles que : * Promotions et actualités de l’entreprise ; * Conditions générales du programme de fidélité ; * Coordonnées de l’entreprise ; * Historique d’achats ; * Autres informations qu’il est important d’afficher.

Additional information section with the Add field action — Chaque entrée ajoutée ici apparaît au dos de la Carte.

Pour ajouter un nouveau champ d’information, cliquez sur le bouton « + Ajouter un champ » et saisissez son nom et sa description dans les champs qui apparaissent. Pour que le champ affiche des informations mises à jour, ajoutez une variable. Les champs peuvent être modifiés, réorganisés et supprimés en cliquant sur le bouton « Masquer ». #### **Liens** La section « Liens » contient des liens qui permettent aux clients de prendre contact et d’accéder aux sites web pertinents en un clic. Par exemple : * Site web de l’entreprise ; * Suivi des commandes ; * Rendez-vous en ligne ; * Informations sur les magasins * Autres liens importants à partager.

Links section of the template editor — Vérifiez que chaque lien ouvre la destination prévue avant l’enregistrement.

--- # 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, and the optional `goal` query parameter: ``` GET https://docs.thewalletcrew.io/configure/fr/advanced-configuration/wallet/template-configuration/cards-design-colors-images-and-fields.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. 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.