Personnalisation des boutons de paiement
Le bouton : "Payer"
Le bouton de paiement est automatiquement ajouté dans votre formulaire à partir du code suivant :
https://github.com/lyra/rest-php-examples/blob/master/www/minimalEmbeddedForm.php#L78-L79
<!-- payment form submit button -->
<button class="kr-payment-button"></button> <!-- payment form submit button -->
<button class="kr-payment-button"></button>1. Personnalisation du label
Choisissez le label de votre choix.
Dans cet exemple, le bouton se nomme Custom label
<button class="kr-payment-button">Custom label</button>
Vous pouvez également insérer une variable pour afficher le montant et la devise.
<button class="kr-payment-button">this will cost %amount-and-currency% !!</button>
2. Personnalisation de la couleur
Pour surcharger la couleur du bouton Payer, il est recommandé de définir le nouveau style dans la balise HEAD de votre page de paiement.
Insérez votre code juste après le chargement du thème et du code JavaScript.
Utilisez la règle css !important.
Exemple de code
<head>
<!-- Javascript library. Should be loaded in head section -->
<script type="text/javascript"
src="https://static.osb.pf/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js"
kr-public-key="58739933:testpublickey_NUFA6m8QLqEaHktbQ1TkA7Z596H8KEFCiKOaO4871cZCH:testpublickey_DEMOPUBLICKEY95me92597fd28tGD4r5">
</script>
<!-- theme and plugins. should be loaded in the HEAD section -->
<link rel="stylesheet" href="https://static.osb.pf/static/js/krypton-client/V4.0/ext/neon-reset.min.css">
<script type="text/javascript" src="https://static.osb.pf/static/js/krypton-client/V4.0/ext/neon.js"></script>
<!-- Overrride payment button background green color -->
<style type="text/css">
.kr-smart-form .kr-payment-button {
background-color: #00D152 !important;
}
</style>
</head>
<body>
...
</body>