# Shopify
Shopify peut être connecté à The Wallet Crew via deux voies complémentaires. Une voie se concentre sur **l’inscription en magasin** et la création/mise à jour des clients dans Shopify. L’autre voie se concentre sur l’ajout d’un **bouton « Ajouter à Wallet »** à la vitrine en ligne.
L’intégration Shopify est différente des intégrations SFCC / Adobe Commerce (Magento) / PrestaShop. Ces plateformes s’appuient généralement sur une implémentation personnalisée de la vitrine du SDK cinto. Shopify propose une surface d’intégration maintenue via un connecteur et une application dédiés, ce qui réduit le code personnalisé et la maintenance à long terme.
* **Inscription par QR code en magasin (flux hébergé par The Wallet Crew).** Un QR code ouvre une interface d’inscription The Wallet Crew. Le flux peut créer ou mettre à jour le client Shopify, puis émettre une carte Wallet.
* **Bouton « Ajouter à Wallet » de la boutique en ligne (application Shopify The Wallet Crew).** L’application Shopify expose un bloc de thème qui affiche un CTA « Ajouter à Wallet » sur certaines pages.
Exemples concrets
* Une marque de vente au détail place un code QR près de la caisse. Le flux crée le client Shopify et émet une Carte de fidélité.
* Une marque DTC ajoute un CTA « Add to Wallet » dans la zone du compte après la connexion.
* Un programme de carte cadeau affiche un CTA « Add to Wallet » sur la page de la carte cadeau après l’achat.
* Un magasin utilise un formulaire piloté par QR pour recueillir le consentement en magasin, puis pousse immédiatement la première Carte.
{% hint style="info" %}
Lorsque seul le bouton de la boutique en ligne est nécessaire, rendez-vous à [Bouton « Add to Wallet » de la boutique en ligne](#online-store-add-to-wallet-button-shopify-app).
{% endhint %}
### Inscription par QR en magasin (flux hébergé par The Wallet Crew)
Cette configuration connecte le flux d’inscription de The Wallet Crew à l’Admin API de Shopify. Elle est généralement utilisée lorsque le parcours en magasin doit créer ou mettre à jour l’enregistrement d’un client Shopify tout en émettant une carte Wallet lors du même scan.
#### Résumé
* Créer une application Shopify **personnalisée** et générer un **jeton d’accès à l’API Admin**.
* Configurer l’ **URL de la boutique + jeton** dans The Wallet Crew.
* Ajouter une `shopify` étape dans `server/flows.yml`.
* Générer un **Rediriger** code QR et l'afficher en magasin.
#### Prérequis
* Accès administrateur à votre boutique Shopify.
* Accès à la console d’administration de The Wallet Crew.
* Un modèle de Carte déjà configuré dans The Wallet Crew.
* Une inscription **mise en page** (la page affichée après avoir scanné le code QR).
{% stepper %}
{% step %}
### Créer un jeton de l’API Admin de Shopify (application personnalisée)
1. Dans l’Admin Shopify, allez à `Paramètres` → `Applications et canaux de vente`.
2. Cliquez sur `Développer des applications` → `Créer une application`.
3. Ouvrir `Configuration` → `Intégration de l’API Admin`.
4. Ajoutez les scopes :
* `read_customers`
* `write_customers`
5. Installez l’application dans votre boutique.
6. Copiez le **jeton d’accès à l’API Admin**.
{% hint style="warning" %}
Traitez le token comme un mot de passe. Faites-le tourner s’il est exposé.
{% endhint %}
{% endstep %}
{% step %}
### Configurer Shopify dans The Wallet Crew
1. Dans le back-office de The Wallet Crew, allez à `Intégration` → `CRM` → `Shopify`.
2. Collez :
* **URL de la boutique** (exemple : `https://your-shop.myshopify.com`)
* **jeton d’accès à l’API Admin**
3. Enregistrez.
{% endstep %}
{% step %}
### Activez Shopify dans `server/flows.yml`
Dans le back-office de The Wallet Crew, allez à `Paramètres` → `Configuration avancée`.
Modifier `server/flows.yml` et assurez-vous que :
* Le fournisseur est activé dans `customerProviders`.
* Le `shopify` step s’exécute **avant** le `Carte` step.
{% code title="server/flows.yml" %}
```yaml
flows :
- type : userRegistration
name : user
steps :
- type : shopify
- type : Carte
passType : {{ passType }}
- type : mail
mailTemplate : downloadPass
customerProviders :
- type : shopify
```
{% endcode %}
{% hint style="info" %}
L’indentation YAML doit être exacte. Une seule mauvaise indentation peut casser tout le flux.
{% endhint %}
{% endstep %}
{% step %}
### Créez le code QR en magasin (Redirection)
1. Dans le back-office de The Wallet Crew, allez à `Mises en page` → `Redirections`.
2. Créez une redirection pointant vers votre mise en page d’inscription.
3. Copiez l’URL ou affichez le code QR.
4. Affichez-le en magasin.
{% endstep %}
{% endstepper %}
#### Validez l’intégration
La validation doit couvrir à la fois la synchronisation des clients Shopify et la livraison de la Carte.
1. Scannez le code QR depuis un téléphone.
2. Terminez l’inscription.
3. Confirmez que le client existe (ou est mis à jour) dans Shopify.
4. Confirmez que la Carte est créée et peut être ajoutée à Apple Wallet / Google Wallet.
#### Dépannage
**401 / 403 de Shopify**
* Revérifiez les portées de l’application. Vous devez `read_customers` et `write_customers`.
* réinstaller l’application personnalisée après avoir modifié les portées.
* Assurez-vous d’avoir collé un **jeton d’accès à l’API Admin** (pas un jeton de storefront).
**Le flux s’exécute, mais aucun client Shopify n’est créé**
* Assurez-vous `- type : shopify` est dans le flux `userRegistration` .
* Assurez-vous `customerProviders` inclut `- type : shopify`.
* Vérifiez l’indentation du YAML.
### Bouton « Ajouter à Wallet » de la boutique en ligne (application Shopify)
L’application Shopify Wallet Crew expose un bloc « Ajouter à Wallet » dans l’éditeur de thème. Cette voie est souvent utilisée lorsqu’un point d’entrée « Ajouter à Wallet » est nécessaire sans développer un module ou un cartridge personnalisé, comme dans les projets SFCC / Magento / PrestaShop.
#### Prérequis
* L’application Shopify Wallet Crew installée et activée.
* Une configuration d’émission de Carte fonctionnelle dans The Wallet Crew (afin que le bouton ait quelque chose à délivrer).
{% stepper %}
{% step %}
### Activer le bloc de thème
1. Allez dans l’admin Shopify → `Boutique en ligne` → `Thèmes`.
2. Cliquez sur `Personnaliser` pour le thème que vous souhaitez modifier.
3. Accédez à la page / au modèle où le bouton doit apparaître.
4. Cliquez sur `Ajouter une section` ou `Ajouter un bloc`.
5. Sous `Applications`, sélectionnez **Add to Wallet Button - The Wallet Crew**.
6. Enregistrez.
{% endstep %}
{% step %}
### Tester
* Sur ordinateur, scannez le code QR avec votre téléphone.
* Sur mobile, appuyez sur **Ajouter à Apple Wallet** ou **Ajouter à Google Wallet**.
{% endstep %}
{% endstepper %}
#### Dépannage
**Le bloc de thème n’apparaît pas**
* Assurez-vous que l’application est installée et activée.
* Essayez d’ajouter le bloc sur un autre modèle (produit vs page vs compte).
* Vérifiez la `Applications` de l’éditeur de thème (pas `Sections`).
### Intégration SDK personnalisée
Si vous ne pouvez pas utiliser l’application Shopify, il est toujours possible d’utiliser l’espace réservé liquid suivant pour afficher le bouton d’ajout à Wallet :
```jsx
{% assign tenantId = 'molia' %}
{% assign secret = 'sTyQrYOKtkIfT77K4wns8cUxfOTV7n57RFztd59wPNqvyvZ9sNnCy3a3s8cikz9z' %}
{% assign y2Identifier = 'SC103010' %}
{% assign y2Identifierhmac = y2Identifier | hmac_sha256: secret %}
```
### FAQ
Le flux QR en magasin et le bouton en ligne peuvent-ils être utilisés ensemble ?
Oui. Le flux en magasin est généralement utilisé pour l’inscription et la création/mise à jour de client. Le bouton de la boutique en ligne est généralement utilisé comme point d’entrée supplémentaire dans le parcours en ligne, souvent dans la zone du compte ou sur les pages après achat.
L’application Shopify est-elle requise pour le flux d’inscription QR en magasin ?
Non. Le flux QR en magasin repose sur une mise en page hébergée par The Wallet Crew et sur le jeton API d’administration Shopify configuré dans les paramètres du connecteur. L’application Shopify est uniquement requise pour le scénario de bloc de thème (« Add to Wallet » button).
Quel jeton Shopify est requis ?
Le connecteur nécessite un **jeton d’accès à l’API Admin** émis par un **personnalisée** Shopify `read_customers` et `write_customers` avec des portées. Un jeton de storefront ne fonctionne pas pour les opérations de création/mise à jour de client.
Quelle est la principale différence par rapport aux intégrations SFCC / Magento / PrestaShop ?
Shopify prend en charge un connecteur maintenu et une application Shopify qui couvre les points d’entrée Wallet courants avec un minimum de travail personnalisé sur la boutique en ligne. Les intégrations SFCC / Magento / PrestaShop nécessitent généralement d’implémenter et de maintenir l’intégration du SDK cinto dans le code de la boutique en ligne.
---
# Agent Instructions: 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.thewalletcrew.io/docs/fr/connecter/e-commerce/shopify.md?ask=
```
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.