Présentation du formulaire embarqué (smartForm)

Le formulaire embarqué (smartForm) vous permet d'intégrer un parcours de paiement fluide et de présenter plusieurs moyens de paiement.
L'acheteur effectuera son parcours de paiement sans quitter le site marchand.

Evolution majeure du formulaire embarqué (cartes)

Le formulaire embarqué (smartForm) a pour avantage de faire évoluer le formulaire embarqué (cartes) en proposant de nouvelles fonctionnalités. Si vous souhaitez migrer, cliquez ici

Intégration de nouveaux moyens de paiement

Le formulaire embarqué (smartForm) permet d'ajouter facilement sans développement des moyens de paiement "non cartes" (redirection, QR code, paiement cash...)

Personnalisation avec le CSS et mise à disposition de plusieurs thèmes

Personnalisez l'aspect de votre formulaire grâce à une feuille de style ainsi que des thèmes prêts à l'emploi et disponibles en open source.

Cas d'utilisation

Mettre en évidence un moyen de paiement

Consultez ce lien pour avoir des informations complémentaires: mettre en évidence un moyen de paiement.

Mettre en évidence plusieurs moyens de paiement

Consultez ce lien pour avoir des informations complémentaires: mettre en évidence plusieurs moyens de paiement

Personnaliser le formulaire embarqué (smartForm)

Masquer les logos du paiement par cartes

Masquer les logos du paiement par cartes
<body> <div class="kr-smart-form" kr-card-form-expanded kr-no-card-logo-header kr-form-token="[GENERATED FORMTOKEN]"> (...) </div> </body> Intégrez la classe `kr-smart-form` et le paramètre `kr-no-card-logo-header` au sein de la DIV, contenant le `formToken`. En intégrant cette fonctionnalité, le marchand peut intégrer ses logos pour personnaliser le formulaire de paiement.

Consultez ce lien pour avoir des informations complémentaires: Masquer les logos du paiement par cartes

Personnaliser la mise en page : exemple alignement horizontal

Personnaliser la mise en page

Personnaliser la mise en page
<style type="text/css"> (...) /to use the CSS Flexbox (Flexible Box)/ .kr-smart-form .kr-embedded .flex-container { flex-direction: row !important; display: flex; } </style> <body> <div class="kr-smart-form" kr-card-form-expanded kr-form-token="[GENERATED FORMTOKEN]"> (...) </div> </div> </body> Intégrez la classe `kr-smart-form` et le paramètre `kr-card-form-expanded` au sein de la DIV, contenant le `formToken`. Pour aligner horizontalement les champs du formulaire embarqué, vous pouvez utiliser les Flexbox en CSS avec la propriété `flex-direction` valorisée à row.

<style type="text/css">
    (...)
 /*to use the CSS Flexbox (Flexible Box)*/  
  .kr-smart-form .kr-embedded .flex-container {
    flex-direction: row !important;
    display: flex;
  }
  </style>
<body>
 <div class="kr-smart-form" kr-card-form-expanded kr-form-token="[GENERATED FORMTOKEN]">
  (...)
  </div>
</div>
</body>

Consultez ce lien pour avoir des informations complémentaires: Personnalisation avancée

Implémentation technique

Migration du formulaire embarqué (cartes) vers le formulaire embarqué (smartForm)

Si vous avez déjà implémenté le formulaire embarqué (cartes), vous trouverez les informations pour migrer vers le formulaire embarqué (smartForm) :

Intégration du formulaire embarqué (smartForm)

Les différentes étapes d'intégration sont :

Prérequis
S’authentifier
Créer le formToken.
Afficher le formulaire de paiement.
Analyser le résultat du paiement.
Passer en Production.

Pour avoir plus d'informations, rendez vous à la rubrique Intégration du formulaire de paiement.