To set up Brick integrations and have a responsive, optimized, and configurable checkout, we provide the common initial configuration process for all Bricks in the steps below.

Use our official libraries to access Mercado Pago's features safely from your frontend.

          
//  The JS code can be included in a < script > tag or a separate JS file.
<script src="https://sdk.mercadopago.com/js/v2"></script>

        

          
npm install @mercadopago/sdk-react

        

Then, initialize the Mercado Pago library to use Checkout Bricks.

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

        

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

        

With the Mercado Pago library added and configured in your project, you are ready to add Bricks to your website. To do so, choose the Brick that best meets your needs and follow the steps detailed in the section corresponding to the chosen Brick.