• France
lyra.com
Rechercher
Catégories
Tags
France
France
Espagne
Europe (Anglais)
Inde
Implémentation
Formulaire intelligent (smartForm)
Formulaire embarqué (cartes)
API REST
API REST PCI-DSS
API REST SEPA
Formulaire en redirection
Échange de fichiers
Paiement mobile
Exemples de code
Modules de paiement
Marketplace
Back Office
Back Office Marchand
Back Office Expert
Guides
Aide
FAQ
Tutoriels vidéos
Support

Paramétrer les modes d'affichage de votre page de paiement

La fonctionnalité d’affichage dite Formulaire intelligent (smartForm) vous offre la possibilité de choisir comment vous souhaiter présenter votre bouton de paiement Apple Pay à l’acheteur.

La configuration de cette affichage est très simple. Elle se fait via des DIV. Il suffit d’utiliser les class fournies dans les exemples.

Tout d’abord, sachez que vous avez trois façons d’afficher votre page de paiement via le formulaire intelligent (smartForm) :
  • mode Pop-in: l’acheteur clique sur le bouton Payer et la page de paiement s’affiche en Pop-in sur votre site marchand.

    Pour le paramétrage, il suffit d’utiliser la class kr-smart-form et d’ajouter l’attribut kr-popin dans une div contenant le paramètre kr-form-token

    Exemple de code :
    <body>
    <div class="kr-smart-form" kr-popin kr-form-token="[GENERATED FORMTOKEN]">
      (...)
    </div>
    </body>
  • mode Liste: la page de paiement est embarquée sur votre site. Tous les moyens de paiement disponibles apparaissent sous forme de liste.

    Pour le paramétrage, il suffit d’utiliser la class kr-smart-form dans une div contenant le paramètre kr-form-token

    Exemple de code :
    <body>
    <div class="kr-smart-form" kr-form-token="[GENERATED FORMTOKEN]">
    (...)  
    </div>
    </body>
  • mode Liste avec carte embarquée: la page de paiement est embarquée sur votre site. Tous les moyens de paiement disponibles apparaissent sous forme de liste et les champs de la saisie de la carte sont présentés ouverts à l’acheteur.

    Pour le paramétrage, il suffit d’utiliser la class kr-smart-form et d’ajouter l’attribut kr-card-form-expanded dans une div contenant le paramètre kr-form-token

    Exemple de code :
    <body>
    <div class="kr-smart-form" kr-card-form-expanded kr-form-token="[GENERATED FORMTOKEN]">  
    (...)
    </div>
    </body>

Quel que soit le cas de figure paramétré, l’acheteur peut effectuer tout son parcours de paiement sans quitter votre site.

Une fois le mode d’affichage défini, vous pouvez aller plus loin.
  • Mettez en évidence uniquement Apple Pay parmi les autres moyens de paiement proposés par la boutique.

    Exemple avec le mode Liste avec carte embarquée

    <body> 
    <div class="kr-smart-form" kr-card-form-expanded  kr-form-token="[GENERATED FORMTOKEN]"></div>
    <!--DIV select one payment method--> 
       (...)     
    <div class="kr-smart-button" kr-payment-method="APPLE_PAY"></div>
     (...)
    </body>

     le champ kr-payment-method accepte aussi la valeur apple_pay.

  • Mettez en évidence Apple Pay avec d’autres moyens de paiement de votre choix.

    Exemple avec le mode Liste avec carte embarquée

    <body> 
    <div class="kr-smart-form" kr-card-form-expanded  kr-form-token="[GENERATED FORMTOKEN]"></div>
    (...)
    <div>
    <div class="kr-smart-button" kr-payment-method="APPLE_PAY"></div>
        (...)
    <div class="kr-smart-button" kr-payment-method="IP_WIRE"></div>
     (...)
        </div>
       (...)
    </body>

  • Présentez par défaut tous les moyens de paiement configurés

    Exemple avec le mode Liste avec carte embarquée

    <body>
    <div class="kr-smart-form" kr-card-form-expanded kr-form-token="[GENERATED FORMTOKEN]"></div>
         (...)
    </body>

Nous recrutons

Head Office :

LYRA NETWORK
109, rue de l’innovation
31670 Labège
FRANCE

2.16.0-doc-1.8