English 中文TürkçeРусскийFrançaisTiếng ViệtEspañol日本語

Boutons

Info

Cette section décrit le nouveau Flow & Paywall Builder, qui fonctionne avec les SDK Adapty version 4.0 ou supérieure.

Les boutons sont les éléments interactifs dans le Flow & Paywall Builder qui répondent aux appuis des utilisateurs. Utilisez-les pour :

  • Les CTA d’achat qui se connectent aux produits et traitent les transactions automatiquement
  • La navigation — faire passer les utilisateurs d’un écran à l’autre (Suivant, Retour, Fermer, Ignorer)
  • Les liens utilitaires — Restaurer les achats, Conditions d’utilisation et Politique de confidentialité
Tip

Placez les CTA d’achat, les liens de restauration et les liens légaux dans un Footer — il est épinglé en bas de l’écran et masque les éléments défilants en dessous.

Ajouter des boutons

Pour ajouter un bouton :

  1. Cliquez sur + et sélectionnez Button.
  2. Sélectionnez un type de bouton.
button-type.webp
  1. Les boutons d’achat, les liens et les boutons de fermeture sont fournis avec des actions préconfigurées. Pour les liens, configurez les URL de navigation vers lesquelles diriger les utilisateurs. Pour les autres types de boutons, rendez-vous dans le panneau Interactions. Là, dans la section Button triggers, configurez les actions que le bouton doit effectuer.
button-action.webp
  1. Configurez le design du bouton dans le panneau Design.

Types de boutons

Boutons d’achat

Pour que les boutons d’achat fonctionnent, associez des produits aux écrans et ajoutez l’élément Products. Consultez le guide.

Un bouton d’achat lance l’achat intégré pour le produit que l’utilisateur a sélectionné sur l’écran. Le SDK traite la transaction automatiquement, vous n’avez donc pas besoin de gérer les achats dans le code de l’application.

Pour ajouter un bouton d’achat :

  1. Cliquez sur + et sélectionnez Button, puis choisissez un préréglage de bouton.
  2. Avec le bouton sélectionné, ouvrez l’onglet Interactions dans le panneau de droite.
  3. Cliquez sur Add trigger > On tap, puis cliquez sur Add action.
  4. Définissez Action sur Purchase et Product sur products.selectedProduct. La variable products.selectedProduct correspond toujours au produit actuellement sélectionné à l’écran.
Tip

Vous pouvez attirer davantage l’attention sur les boutons d’achat en les animant. Le Paywall Builder prend actuellement en charge le type d’animation Pulse.

Configurez le style d’animation dans le panneau Design.

purchase-button.webp
Important

Les boutons Terms of Use et Privacy Policy ont une action Open URL intégrée. Définissez l’URL de destination à cet endroit. Les Open URL vides et les liens inline bloquent la prévisualisation et la publication.

Pour respecter certaines exigences des stores, vous pouvez ajouter des liens vers :

  • Les conditions d’utilisation
  • La politique de confidentialité
  • La restauration des achats

Pour ajouter des liens :

  1. Cliquez sur + et sélectionnez Button > Links. Cela ajoutera une rangée de boutons en ligne avec des actions prédéfinies : restaurer les achats ou ouvrir une URL. Si vous n’avez pas besoin de tous les boutons inclus, supprimez les inutiles dans le panneau des calques.
add-links.webp

  1. Ensuite, configurez les actions des boutons :

    • Le bouton Restore purchases gère déjà la restauration des achats.
    • Pour chaque lien restant :
      1. Cliquez sur le bouton pour le sélectionner, puis passez à l’onglet Interactions sur la droite.
      2. Collez l’URL dans le champ.
      3. Par défaut, l’URL s’ouvre dans un navigateur intégré pour une expérience fluide. Si vous souhaitez rediriger les utilisateurs vers un navigateur externe, cochez la case Open in external browser.
pb-links.webp

Fermer le flow

Le bouton Close ferme le flow automatiquement.

Pour ajouter un bouton de fermeture, cliquez sur + et sélectionnez Button > Close flow.

close-flow.webp
Tip

Utilisez la position Absolute pour placer votre bouton de fermeture dans le coin de l’écran.

Vous pouvez également configurer n’importe quel autre bouton pour fermer le flow en utilisant les actions.

Boutons personnalisés

Chaque bouton peut être configuré pour exécuter une action au clic :