Payment Brick
O Payment Brick é uma solução modular e personalizável que permite adicionar vários métodos de pagamento à sua loja com apenas um Brick, permitindo que você salve os dados do cartão para compras futuras. Ao utilizar o Payment Brick, você terá diferentes métodos de pagamento à sua disposição e poderá escolher quais habilitar para o seu site.
Neste momento, você poderá dar aos seus clientes a possibilidade de efetuarem pagamentos através de cartões de débito e crédito, Pago Fácil, Rapipago, utilizar a Conta Mercado Pago e Parcelamento sem cartão.
A possibilidade de guardar os dados dos cartões que já foram debitados em compras anteriores torna o processo de pagamento mais eficiente e rápido. Para o comprador, não é mais necessário recarregar os dados cada vez que entrar no checkout.
Por sua vez, nosso processador cumpre todas as garantias de segurança para oferecer aos usuários a máxima proteção ao salvar seus dados. Essa é uma das grandes vantagens de adicionar o Checkout Bricks ao seu site: a tranquilidade de oferecer uma solução segura, respaldada pelo Mercado Pago, mas customizada para as necessidades da sua empresa.
Layout
O layout do Payment Brick foi construído com base nas melhores práticas de UX para que seja possível entregar ao comprador a melhor experiência sem que você precise se preocupar com detalhes de design. O layout traz os elementos detalhados abaixo.
Campos dos formulários
Seção | Elemento | Características | Observações |
Container das opções de pagamento | Título Propriedade: formTitle | Valor (título): Cartão de crédito ou débito Label: N/A Placeholder: N/A Tipo: string Formato: N/A Máx caracteres: N/A | Opcional Customizável |
Container das opções de pagamento | Botão de pagamento Propriedade: formSubmit | Valor: [imagem] Pagar Label: N/A Placeholder: N/A Tipo: string callback: onSubmit função: promise(cardFormData) | Opcional Ocultável e customizável *A função recebe os dados do formulário, incluindo o token do cartão e apresenta animação de carregamento. |
Formulário do pagamento com cartão | Campo para inserção do número do cartão Propriedade: cardNumber | Valor: N/A Label: Número do cartão Placeholder: 1234 1234 1234 1234 Tipo: number Formato: N/A Máx. caracteres: a depender do emissor, podendo variar entre 15 e 16. | Obrigatório Customizável (label, placeholder) |
Formulário do pagamento com cartão | Campo para inserção da data de vencimento do cartão Propriedade: expirationDate | Valor: N/A Label: Data de vencimento Placeholder: MM/AA Tipo: date Formato: MM/AA Máx. caracteres: 5 | Obrigatório Customizável (label, placeholder) |
Formulário do pagamento com cartão | Campo para inserção do código de segurança Propriedade: securityCode | Valor: N/A Label: Nome do titular como aparece no cartão Placeholder: João Silva Tipo: string Formato: N/A Máx. caracteres: 100 | Obrigatório Customizável (label, placeholder e máximo de caracteres errados) |
Formulário do pagamento com cartão | Campo para inserção do nome do titular do cartão Propriedade: cardholderName | Valor: N/A Label: Nome do titular como aparece no cartão Placeholder: Ex.: João Silva Tipo: select Formato: N/A Máx. caracteres: N/A | Obrigatório Customizável (label, placeholder, tipo, formato e máximo de caracteres errados) |
Formulário do pagamento com cartão | Campo para seleção do documento do titular do cartão Propriedade: cardholderIdentificationType | Valor: DNI, CI, LC, LE, Otro Label: Documento Placeholder: N/A Tipo: select Formato: N/A Máx. caracteres: N/A | Obrigatório* Customizável (label, placeholder) *Se os dados de tipo de documento e número de documento foram fornecidos e salvos anteriormente, este elemento se torna opcional. |
Formulário do pagamento com cartão | Campo para inserção do número do documento do titular do cartão Propriedade: cardholderIdentificationNumber | Valor: N/A Label: N/A Placeholder: N/A. Tipo: number Formato: N/A Máx. caracteres: N/A | Obrigatório Não customizável |
Formulário do pagamento com cartão, Rapipago ou Pago Fácil | Campo para inserção do email do comprador Propriedade: email | Valor: N/A Label: Email Placeholder: Ex.: joaosilva@email.com Tipo: string Formato: padrão de e-mail convencional (exemplo@email.com) Máx. caracteres: N/A | Obrigatório* Customizável (label, placeholder) *Se os dados foram fornecidos e salvos anteriormente, este elemento se torna opcional. |