Configurer les achats

Votre flow peut afficher vos produits disponibles et déclencher des achats intégrés :

1. Ajoutez les produits du store dans l’Adapty Dashboard. Connectez des produits existants, ou créez-en de nouveaux dans Adapty et envoyez-les vers les stores.
2. Sélectionnez des produits depuis votre tableau de bord et ajoutez-les à un écran du flow. Les cartes, variables et actions de cet écran pourront alors les utiliser.
3. (Facultatif) Configurez un groupe de cartes produits pour présenter plusieurs options d’achat.
4. Ajoutez une action Purchase à un bouton et configurez-la. La cible de l’action peut être un produit spécifique ou le produit sélectionné par l’utilisateur.
5. Ensuite, utilisez le panneau Products pour ajouter, remplacer ou supprimer des produits dans le flow. Les utilisateurs voient les changements dès que vous publiez le flow, sans mise à jour de l’application.

Ajouter des produits à un écran

Chaque écran possède sa propre liste de produits. Une carte, une variable ou une action ne peut utiliser qu’un produit issu de cette liste. Le panneau Products affiche la liste de chaque écran du flow.

Vous pouvez ajouter des produits depuis le panneau Products, ou les sélectionner lors de la configuration d’un élément. Les deux méthodes ajoutent le produit à la liste de l’écran.

Ajouter des produits dans le panneau Produits

Le panneau permet d’ajouter un produit à la liste de l’écran. N’importe quel élément de l’écran peut ensuite l’utiliser : une carte produit, une variable texte ou une action. Une variable texte, par exemple, peut afficher le prix d’un produit qui n’a pas de carte.

Pour ajouter un produit à un écran :

1. Dans le panneau de gauche, ouvrez le panneau Products et cliquez sur +.
2. Screen indique l’écran actuel. Pour ajouter le produit à un autre écran, sélectionnez-le ici.
3. Sous Product, sélectionnez un produit depuis votre Dashboard.
4. (Optionnel) Sous Offer, sélectionnez l’offre avec laquelle vendre le produit. Voir Ajouter une offre à un flow.
5. Cliquez sur Add product.

Le panneau Products liste les produits que vous avez ajoutés, regroupés par écran. Une offre sélectionnée ici est pré-sélectionnée sur chaque carte qui utilise ensuite ce produit. Rien ne change dans le flow tant que vous n’assignez pas le produit à un élément ou ne l’utilisez pas dans une action.

Ajouter des produits lors de la configuration d’un élément

Quand vous sélectionnez un produit dans un élément, le builder l’ajoute à la liste de l’écran. Cela se produit lorsque vous :

• Assignez un produit à une carte produit.
• Insérez une variable de produit dans un élément texte.
• Définissez le Product d’une action Purchase.

Chaque liste déroulante affiche d’abord les produits déjà ajoutés à cet écran, puis le reste de votre catalogue. Un produit sélectionné avec une offre différente obtient sa propre entrée : le panneau et les listes déroulantes affichent une entrée par paire produit/offre.

Pour configurer les éléments eux-mêmes, continuez avec Ajouter des fiches produit et Déclencher un achat.

Ajouter des cartes de produits

Pour proposer un choix de produits aux utilisateurs, ajoutez un élément Products. Il se présente sous la forme d’un ensemble de trois cartes de produits dans une mise en page prédéfinie. Les cartes forment un groupe de produits : l’utilisateur en sélectionne une, et une action Purchase peut ensuite acheter le produit sélectionné.

Cet ensemble est le seul moyen d’obtenir des cartes de produits ou un groupe de produits. Pour obtenir plus ou moins de cartes, dupliquez-en ou supprimez-en après avoir ajouté l’ensemble.

Ajouter un groupe de produits

1. Ouvrez le panneau Add element.

2. Sélectionnez la catégorie Products.

3. Choisissez un modèle de mise en page : Vertical List, Horizontal List, Feature Carousel, Feature Cards ou Banner List.

   

Configurer une carte produit

Pour chaque carte du groupe :

1. Sélectionnez la carte. Dans l’onglet Design, sous Product, attribuez-lui un produit. Les produits déjà ajoutés à cet écran se trouvent dans la section Added, suivis du reste de votre catalogue.
2. Confirmez l’offre active. Si vous avez précédemment associé le produit à une offre, celle-ci apparaît automatiquement. Vous pouvez sélectionner une offre différente manuellement, mais une copie du produit apparaîtra alors dans le panneau Products.
3. Pour présélectionner cette carte à l’ouverture de l’écran, sélectionnez Set as default.

4. (Facultatif) Pour indiquer aux utilisateurs quel forfait est sélectionné, stylisez les états Selected des cartes.

Terminez la configuration de la carte avec quatre fonctionnalités optionnelles :

• Prix dynamique : Remplacez le prix indicatif par la variable de prix du produit. La carte affiche alors le prix du store dans la devise de l’utilisateur.
• Conditions de l’offre : Pour détailler les conditions de l’offre, utilisez les variables d’offre dans le texte de la carte : offer_price, offer_billing_period et offer_full_duration.
• Badge : Placez un badge pour mettre en avant un plan particulier.
• Prix d’ancrage : Un élément Ancien Prix dans la carte affiche le prix réel multiplié par un coefficient que vous définissez, barré, de sorte que le prix réel apparaisse comme une remise. La devise et le format correspondent toujours au prix réel, et le montant se met à jour automatiquement en cas de changement de prix.

Déclencher un achat

L’action Purchase lance l’achat en store d’un produit. Vous pouvez l’associer à n’importe quel élément du flow, mais les boutons et les fiches produit sont les options les plus courantes.

Ajouter un bouton d’achat

Pour ajouter un bouton d’achat :

1. Ouvrez le panneau Add element.
2. Choisissez un preset dans la catégorie Button.
3. Le bouton étant sélectionné, ouvrez l’onglet Interactions dans le panneau de droite.
4. Cliquez sur Add trigger > On tap, puis sur Add action.
5. Définissez Action sur Purchase, puis définissez Product sur l’une des options suivantes :
   • products.selectedProduct : achète le produit que l’utilisateur a sélectionné depuis un élément Products à l’écran.
   • Un produit spécifique : achète toujours ce produit, quelle que soit la sélection sur l’écran.

Déclencher un achat depuis une fiche produit

Une fiche produit peut lancer l’achat directement, sans qu’un bouton séparé soit nécessaire. Ajoutez l’action Purchase à chaque fiche individuellement à la place.

Afficher le prix sur le bouton

Pour insérer le prix du produit sélectionné dans le libellé du bouton, utilisez une variable :

1. Avec le bouton sélectionné, ouvrez l’onglet Design dans le panneau de droite.
2. Dans le champ Content, placez le curseur à l’endroit où le prix doit apparaître.
3. Cliquez sur l’icône de variable, sélectionnez products.selectedProduct, puis l’attribut prod_price. La variable complète est products.selectedProduct.prod_price.
4. Ajoutez du texte statique autour de la variable — par exemple, Subscribe for {prod_price}.

Le libellé se met à jour lorsque l’utilisateur sélectionne un produit différent.

Restaurer les achats

Les abonnés existants doivent pouvoir restaurer leurs achats précédents. Ajoutez un bouton avec l’action Restore purchases :

• Utilisez le preset Links dans la catégorie Button. Il comprend une rangée de trois boutons texte — Restore (préconfiguré), Terms of use et Privacy policy.
  
• Ajoutez l’action Restore purchases à un autre bouton.
  1. Sélectionnez le bouton et ouvrez l’onglet Interactions.
  2. Cliquez sur Add trigger > On tap, puis cliquez sur Add action.
  3. Dans le menu déroulant Action, sélectionnez Restore purchases.

L’absence d’un bouton de restauration n’empêche pas la publication, mais peut entraîner un rejet par le store. Utilisez le skill flow-audit pour identifier les paywalls sans fonctionnalité de restauration.

Modifier le contenu d’un écran selon le produit sélectionné

Si un écran contient des cartes produit, vous pouvez afficher ou masquer d’autres éléments selon la carte sélectionnée par l’utilisateur.

Pour configurer la visibilité conditionnelle :

1. Dans l’élément Products, sélectionnez une carte produit.

2. Ouvrez l’onglet Interactions dans le panneau de droite et cliquez sur Add trigger.

   

3. Sélectionnez On tap et cliquez sur Add action.

4. Dans le menu déroulant Action, sélectionnez Show ou Hide.

5. Sélectionnez l’élément à afficher ou masquer lorsque ce produit est sélectionné.

   

Modifier le produit sélectionné depuis d’autres éléments

Les utilisateurs changent généralement le produit sélectionné en appuyant sur une carte. Mais d’autres éléments, comme le bouton bascule d’essai, peuvent utiliser l’action Select product pour modifier la sélection à la place.

Pour configurer l’action :

1. Sélectionnez l’élément qui doit modifier la sélection — un bouton, un interrupteur ou tout autre élément. La carte ciblée doit se trouver sur le même écran.
2. Ouvrez l’onglet Interactions dans le panneau de droite et cliquez sur Add trigger.
3. Sélectionnez le déclencheur et cliquez sur Add action.
4. Dans le menu déroulant Action, sélectionnez Select product.
5. Définissez Product sur la carte produit que l’action doit sélectionner.

Gérer les produits du flow

Le panneau Products affiche tous les produits du flow, regroupés par écran.

• Le chiffre affiché à côté du nom du produit indique le nombre de références à ce produit sur l’écran : chaque carte, chaque variable de produit dans un élément texte, et chaque action.
• Le prix affiché à droite est le prix de base du produit. Si une offre est associée, il inclut le prix avec et sans la remise.
• Le ou les produits par défaut sont listés dans une section séparée.

Pour ajouter une entrée, cliquez sur + et suivez les instructions dans Ajouter des produits dans le panneau Produits.

Actions sur les produits

Ouvrez le menu contextuel d’un produit pour le gérer :

• Set as default : présélectionne la carte de ce produit à l’ouverture de l’écran, comme la case Set as default sur la carte. Disponible uniquement pour les produits qui ont exactement une carte sur l’écran.
• Replace in N places : remplace le produit dans toutes les cartes, éléments texte et actions qui l’utilisent sur cet écran. Le champ Offer est réinitialisé. Si d’autres écrans utilisent le même produit et la même offre, le toast de confirmation propose de répéter la modification sur ces écrans.
• Offer : modifie l’offre pour chaque utilisation du produit sur cet écran. Si le produit existe sur d’autres écrans, vous pouvez également y appliquer la modification. Pour prévisualiser l’apparence de l’écran selon les différents types d’offre, sélectionnez Preview as dans le même sous-menu.
• Remove : retire le produit de la liste de l’écran. Les cartes et les actions Purchase qui l’utilisaient perdent instantanément leurs paramètres de produit — remplacez le produit avant de publier. Les variables texte et les conditions conservent la référence et affichent une icône d’avertissement. Son infobulle indique This product is off this screen jusqu’à ce que vous rajoutiez le produit, remplaciez la référence ou supprimiez le texte.
• Missing : un produit ou une offre supprimé dans votre Dashboard conserve son entrée, marquée Missing, avec le nombre d’utilisations. Seules les options Replace in N places et Remove restent disponibles, et chaque utilisation restante bloque la publication.

Résolution des problèmes liés aux produits

Les problèmes suivants liés aux produits et aux offres bloquent la publication :

• Une fiche produit ou une action Purchase sans produit associé. Associez un produit ou supprimez la fiche/l’action.
• Un produit ou une offre absent de votre Dashboard. Cela se produit si vous ajoutez un produit à un flow, puis le supprimez de votre compte Adapty. Repérez l’entrée Missing dans le panneau Products, et remplacez toutes les occurrences par un produit existant.
• Une variable d’offre utilisée avec un produit qui n’a pas d’offre. Définissez une offre pour le produit dans le panneau Products, ou supprimez la variable.
• Une variable de texte ou une condition fait toujours référence à un produit que vous avez supprimé dans le panneau Products. Rajoutez le produit avec +, ou modifiez la référence.

Vous pouvez tout de même enregistrer le flow avec le problème présent : itérez jusqu’à ce que la publication réussisse.