Inicio común

Para configurar la integración de Bricks y tener un pago receptivo, optimizado y configurable, proporcionamos en los pasos a continuación el proceso de configuración inicial común para todos los Bricks.

Incluir la biblioteca de Mercado Pago

Client-Side

Utiliza nuestras bibliotecas oficiales para acceder a las funcionalidades de Mercado Pago de forma segura desde tu frontend.

// El código JS se puede incluir en una etiqueta < script > o en un archivo JS separado.
<script src="https://sdk.mercadopago.com/js/v2"></script>

npm install @mercadopago/sdk-react

Inicializar biblioteca de Mercado Pago

A continuación, inicializa la biblioteca de Mercado Pago para utilizar Checkout Bricks.

const mp = new MercadoPago('YOUR_PUBLIC_KEY');
const bricksBuilder = mp.bricks();

import { initMercadoPago } from '@mercadopago/sdk-react';
initMercadoPago('YOUR_PUBLIC_KEY');

Elegir el Brick

Con la biblioteca de Mercado Pago agregada y configurada en tu proyecto, estás listo para agregar Bricks a tu sitio web. Para ello, elige el Brick que mejor se adapte a tus necesidades y sigue los pasos detallados en el apartado correspondiente al Brick elegido.

Bricks

Conoce todos los módulos de Checkout Bricks y su disponibilidad.

Payment Brick

Ofrece diferentes medios de pago a tus clientes, con la posibilidad de guardar datos de la tarjeta para futuras compras. Prueba la demostración del Brick antes de integrarlo.

Saber más Acceder a demostración

Wallet Brick

Vincula la cuenta de Mercado Pago y permite pagos logueados. Prueba la demostración del Brick antes de integrarlo.

Saber más Acceder a demostración

Card Payment Brick

Ofrece pagos con tarjeta de crédito y débito. Prueba la demostración del Brick antes de integrarlo.

Saber más Acceder a demostración

Status Screen Brick

Informa a tus clientes los resultados del proceso de compra, luego de realizado el pago. Prueba la demostración del Brick antes de integrarlo.

Saber más Acceder a demostración