Payment Brick
Payment Brick es una solución modular y personalizable que permite agregar varios medios de pago a tu tienda con solamente un Brick, permitiendo guardar los datos de tarjetas para compras futuras. Al utilizar Payment Brick, tendrás a tu disposición diferentes medios de pago y podrás elegir cuáles habilitar para tu sitio.
Por el momento, podrás darle a tus clientes la posibilidad de hacer pagos a través de tarjetas de débito y crédito o utilizar la Cuenta de Mercado Pago. En el corto plazo sumaremos la posibilidad de que, usando este mismo Brick, puedas permitirle también realizar pagos en efectivo.
La posibilidad de guardar los datos de tarjetas que ya fueron cargadas en compras anteriores, hace que el proceso de pago sea más eficiente y rápido. Para el comprador ya no es necesario tener que volver a cargar los datos cada vez que ingrese al checkout.
A su vez, nuestro procesador cumple con todas las garantías de seguridad para darle a los usuarios la máxima protección al guardar sus datos. Esa es una de las grandes ventajas de sumar Checkout Bricks a su sitio: la tranquilidad de brindar una solución segura, con el respaldo de Mercado Pago, pero personalizado a las necesidades de su empresa.
Layout
El layout de Payment Brick se basa en las mejores prácticas UX para que sea posible ofrecer al comprador la mejor experiencia sin que debas preocuparte por detalles de diseño. Presenta los elementos detallados a continuación.
Campos de los formularios
| Sección | Elemento | Características | Observaciones |
| Container de opciones de pago | Título Propiedad: formTitle | Valor (título): Tarjeta de crédito o débito Label: N/A Placeholder: N/A Tipo: text/imagen Formato: N/A Máx. caracteres: N/A | Opcional Personalizable |
| Container de opciones de pago | Botón de pago Propiedad: formSubmit | Valor: [imagen] Pagar Label: N/A Placeholder: N/A Tipo: text callback: onSubmit função: promise(cardFormData) | Opcional Ocultable y personalizable *La función recibe los datos del formulario, incluido el token de la tarjeta, y presenta una animación de carga. |
| Formulario de pago con tarjeta | Campo para ingresar el número de tarjeta Propiedad: cardNumber | Valor: N/A Label: Número de tarjeta Placeholder: 1234 1234 1234 1234 Tipo: number Formato: N/A Máx. caracteres: dependiendo del emisor, pudiendo variar entre 15 y 16. | Obligatorio Personalizable (label, placeholder) |
| Formulario de pago con tarjeta | Campo para ingresar la fecha de vencimiento de la tarjeta Propiedad: expirationDate | Valor: N/A Label: Fecha de vencimiento Placeholder: MM/AA Tipo: date Formato: MM/AA Máx. caracteres: 5 | Obligatorio Personalizable (label, placeholder y máximo de caracteres incorrectos) |
| Formulario de pago con tarjeta | Campo para ingresar el código de seguridad Propiedad: securityCode | Valor: N/A Label: Código de seguridad Placeholder: 1234 Tipo: integer Formato: N/A Máx. caracteres: 4 | Obligatorio Personalizable (label, placeholder) |
| Formulario de pago con tarjeta | Campo para ingresar el nombre del titular de la tarjeta Propiedad: cardholderName | Valor: N/A Label: Nombre del titular tal y como aparece en la tarjeta Placeholder: João Silva Tipo: string Formato: N/A Máx. caracteres: 100 | Obligatorio Personalizable (label, placeholder, tipo, formato y máximo de caracteres incorrectos.) |
| Formulario de pago con tarjeta | Campo para seleccionar el documento del titular de la tarjeta Propiedad: cardholderIdentificationType | Valor: CC, CE, NIT, Otro Label: Documento Placeholder: N/A Tipo: select Formato: N/A Máx. caracteres: N/A | Obligatorio* Personalizable (label, placeholder) *Si los datos de tipo y número de documento se proporcionaron y guardaron previamente, este elemento se vuelve opcional. |
| Formulario de pago con tarjeta | Campo para ingresar el número de documento del titular de la tarjeta Propiedad: cardholderIdentificationNumber | Valor: N/A Label: N/A Placeholder: N/A Tipo: number Formato: N/A Máx. caracteres: N/A | Obligatorio No personalizable |
| Formulario de pago con tarjeta | Campo para ingresar el correo electrónico del comprador Propiedad: email | Valor: N/A Label: Email Placeholder: joaosilva@email.com Tipo: string Formato: formato de e-mail convencional (ejemplo@email.com) Máx. caracteres: N/A | Obligatorio* Personalizable (label, placeholder) *Si los datos se proporcionaron y guardaron previamente, este elemento se vuelve opcional. |