Inline Integration

Apprenez à intégrer le flux Inline.

Aperçu

Grâce à notre intégration Inline, vous pouvez mettre en évidence les accessoires de valeur d'Affirm dès le début du processus de paiement et définir des attentes claires avec vos clients.


How It Works

Lorsqu'un client sélectionne Affirm comme option de paiement, la vue se développe et affiche les informations suivantes sur votre site :

  • Propositions de valeur : met en évidence certains des avantages du paiement avec Affirm
  • En savoir plus sur Affirm : un lien En savoir plus qui ouvre notre modal éducatif.
  • Délais de paiement: L'échéancier et le montant de chaque paiement
1038

Cette image montre le flux Inline pour les options paiement en 4 et versement.


Inline Flow

1. Render Affirm Checkout

Créez un objet de caisse et lancez l'expérience en ligne Affirm à l'aide des fonctions affirm.checkout.open() et affirm.checkout.inline() .

affirm.checkout({
          total: 15099
        });
affirm.checkout.inline({
          merchant: {
            inline_container: "custom-inline-checkout-container"
          },
        });

2. Specify an id in the Merchant Object

Fournissez un conteneur et spécifiez un identifiant dans l'objet commerçant à l'aide de la clé « inline_conteneur ». La définition d'un conteneur spécifie l'endroit où vous souhaitez que l'option de paiement s'affiche et assure qu'elle est correctement espacée.

"merchant": {
        "inline_container": "my-special-container-id"
      },

📘

Important

If you don’t specify an id, affirm.js will look for a container named with a default id of affirm-inline-checkout-container.


Recette

Utilisez notre recette d’intégration d’accessoires de valeur Inline pour parcourir les exemples de code étape par étape.


Exemple


Platform Integrations

Inline is currently available for the Magento 2 (Adobe Commerce), WooCommerce, and Shopify Plus e-commerce platforms.