Etapa 4: Exibir o formulário de pagamento

Objetivo

Exibir todos os campos de pagamento (número de cartão, data de validade, CVV, etc.) no seu site Web.

I.Iniciar o formulário de pagamento

No HEAD da página, é preciso incluir em um tag <script> os dados seguintes.

Carregar nossa biblioteca JavaScript

src="https://static.lyra.com/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js"

Implementar a chave pública

Valor, da chave pública , no parâmetro kr-public-key

<head>
(...)
<script type="text/javascript"
        (...)
        kr-public-key="69876357:testpublickey_DEMOPUBLICKEY95me92597fd28tGD4r5"
        (...)
 </script>
(...)
 </head>

Como lembrete, ela corresponde à 3ª chave da tabela.

Adicionar outros parâmetros de inicialização

Adição de 2 parâmetros de inicializado , por exemplo:

SOBRENOME	Descrição
kr-post-url-success	URL para qual será redirecionado o navegador do comprador se o pagamento for realizado com sucesso. ( recomendado )
kr-language	Define o idioma de exibição do formulário. Aceita o iso ISO 639-1 (fr ou fr-FR). Se o parâmetro não estiver definido, o formulário usará o idioma do navegador.

. Exemplo de código:

<head>
(...)
<script type="text/javascript"
        src="https://static.lyra.com/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js"
        kr-public-key="69876357:testpublickey_DEMOPUBLICKEY95me92597fd28tGD4r5"
        kr-post-url-success="paid.php";
        kr-language="en-EN">
 </script>
(...)
 </head>

Référez vous à ces 2 rubriques Paramètres généraux et Paramètres de personnalisation des "placeholders" pour connaître les autres paramètres. Après la balise <script>, choisissez un thème.

Escolha um tema

Classic é o tema por padrão. Aqui estão os links para carregar esse tema.

<head>
(...)
<link rel="stylesheet" href="https://static.lyra.com/static/js/krypton-client/V4.0/ext/classic.css">
  <script
  src="https://static.lyra.com/static/js/krypton-client/V4.0/ext/classic.js">
 </script>
 (...)
 </head>

Mais informações sobre os temas.

Adicionar funções JS ( opcional ):

Em outra tag <script>, integrar eventos ou métodos JS.
Para obter mais detalhes, consulte Apresentação dos eventos e Apresentação dos métodos.

. Exemplo de código para o HEAD sem função JS:

<head>
<!-- STEP :
1 : load the JS librairy 
2 : required public key with file config.php
3 : the JS parameters url sucess and langage EN  -->

<script type="text/javascript"
        src="https://static.lyra.com/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js"
        kr-public-key="69876357:testpublickey_DEMOPUBLICKEY95me92597fd28tGD4r5"
        kr-post-url-success="paid.php";
        kr-language="en-EN">
 </script>

  <!--  theme CLASSIC should be loaded in the HEAD section   -->
<link rel="stylesheet" href="https://static.lyra.com/static/js/krypton-client/V4.0/ext/classic-reset.min.css">
<script src="https://static.lyra.com/static/js/krypton-client/V4.0/ext/classic.js">
 </script>
 </head>

II. Definir o modo de exibição

Dans le BODY, choisissez le mode d'affichage qui vous convient.

Modo	Descrição
incorporado	Exibe os campos do pagamento por cartões (número de cartão, data de expiração, CVV, etc.)
pop-in	Exibe um botão de pagamento que abre uma pop-in contendo os campos de pagamento (número do cartão, data de validade, CVV, etc.).

Modo incorporado	Modo Popin
<body> <div class="kr-embedded" kr-form-token="[GENERATED FORMTOKEN]"></div> (...) </body>	<body> <div class="kr-embedded" kr-popin kr-form-token="[GENERATED FORMTOKEN]"></div> (...) </body>
Mais informações : Modo incorporado	Mais informações : Modo pop-in

III. Personalização avançada

Essa etapa é opcional.

Exemplo de personalização:

IV. Exemplo simplificado PHP

Na pasta sample, os arquivos de exemplo são:

embedded.php.
popin.php.

Para obter mais detalhes, Arquivo de exemplo: embedded.php e popin.php

Categoria