The integration with Checkout Pro allows you to charge via our web form from any device in a simple, fast and secure way.
In this documentation you will find all the necessary steps to integrate Checkout Pro through our SDKs. To do this, follow the steps described below.
init_point attribute, in the API request response. From there, just use it to redirect the buyer to the checkout.The first step to integrate Checkout Pro is to install the Mercado Pago SDK in your project. To do this, use one of the codes available below.
php composer.phar require "mercadopago/dx-php"
To install the SDK, you must run the following code in your terminal command line using npm:
npm install Mercadopago
file and run the code < code>maven install in your terminal command line:
<dependency>
<groupId>com.mercadopago</groupId>
<artifactId>sdk-java</artifactId>
<version>2.1.7</version>
</dependency>
To install the SDK, you must run the following code in your terminal command line using gem:
gem install Mercadopago-sdk
plain
</div><pre class='language-csharp line-numbers'>
<code id='code_5'> nuget install Mercadopago-sdk </code>
</pre>
</div>
<button type='button' class='ui-button ui-button--secondary ui-button--small btn-copy-code' data-snippet-id='5'>CopiarTo install the SDK, you must run the following code in the command line of your terminal using pip:
pip3 install MercadoPago
Server-Side
Preferences are sets of information that allow you to configure a product or service that you want to charge, such as price and quantity, as well as other settings related to the defined payment flow.
To create a preference, use one of the SDKs available below, filling in the attributes with the respective information.
<?php
// Mercado Pago SDK
require __DIR__ . '/vendor/autoload.php';
// Add Your credentials
MercadoPago\SDK::setAccessToken('PROD_ACCESS_TOKEN');
?>
// Mercado Pago SDK
const mercadopago = require ('mercadopago');
// Add Your credentials
mercadopago.configure({
access_token: 'PROD_ACCESS_TOKEN'
});
// Mercado Pago SDK
import com.mercadopago.MercadoPagoConfig;
// Add Your credentials
MercadoPagoConfig.setAccessToken("PROD_ACCESS_TOKEN");
# Mercado Pago SDK
require 'mercadopago'
# Add Your credentials
sdk = Mercadopago::SDK.new('PROD_ACCESS_TOKEN')
// Mercado Pago SDK
using MercadoPago.Config;
// Add Your credentials
MercadoPagoConfig.AccessToken = "PROD_ACCESS_TOKEN";
# Mercado Pago SDK
import mercadopago
# Add Your credentials
sdk = mercadopago.SDK("PROD_ACCESS_TOKEN")
When you finish creating the preference, you need to configure it according to your product or service. To do so, use one of the codes available below, filling in the attributes with the respective information.
<?php
// Create a preference object
$preference = new MercadoPago\Preference();
// Create a preference item
$item = new MercadoPago\Item();
$item->title = 'My Item';
$item->quantity = 1;
$item->unit_price = 75.56;
$preference->items = array($item);
$preference->save();
?>
// Create a preference object
let preference = {
items: [
{
title: 'My Item',
unit_price: 100,
quantity: 1,
}
]
};
mercadopago.preferences.create(preference)
.then(function(response){
// This value replaces the String "<%= global.id %>" in your HTML
global.id = response.body.id;
}).catch(function(error){
console.log(error);
});
PreferenceItemRequest itemRequest =
PreferenceItemRequest.builder()
.id("1234")
.title("Games")
.description("PS5")
.pictureUrl("http://picture.com/PS5")
.categoryId("games")
.quantity(2)
.currencyId("BRL")
.unitPrice(new BigDecimal("4000"))
.build();
List<PreferenceItemRequest> items = new ArrayList<>();
items.add(itemRequest);
PreferenceRequest preferenceRequest = PreferenceRequest.builder()
.items(items).build();
PreferenceClient client = new PreferenceClient();
Preference preference = client.create(request);
# Create a preference request
preference_data = {
items: [
{
title: 'My Item',
unit_price: 75.56,
quantity: 1
}
]
}
preference_response = sdk.preference.create(preference_data)
preference = preference_response[:response]
# This value replaces the String "<%= @preference_id %>" in your HTML
@preference_id = preference['id']
// Create the preference request object
var request = new PreferenceRequest
{
Items = new List<PreferenceItemRequest>
{
new PreferenceItemRequest
{
Title = "My Item",
Quantity = 1,
CurrencyId = "PEN",
UnitPrice = 75.56m,
},
},
};
// Create the preference using the client
var client = new PreferenceClient();
Preference preference = await client.CreateAsync(request);
# Create a preference item
preference_data = {
"items": [
{
"title": "My Item",
"quantity": 1,
"unit_price": 75.76
}
]
}
preference_response = sdk.preference().create(preference_data)
preference = preference_response["response"]
Client-Side
Once you have created the preference in your backend, you will need to install the Mercado Pago frontend SDK to your project in order to add the Checkout Pro button.
The installation is done in two steps: adding the Mercado Pago SDK to the project with your configured credentials and starting the checkout from the previously generated preference.
html
// SDK MercadoPago.js
<script src="https://sdk.mercadopago.com/js/v2"></script>
<div class="cho-container"></div>
<script>
const mp = new MercadoPago('PUBLIC_KEY', {
locale: 'pt-BR'
});
mp.checkout({
preference: {
id: 'YOUR_PREFERENCE_ID'
},
render: {
container: '.cho-container',
label: 'Pay',
}
});
</script>
In the example above, a payment button will be rendered and will be responsible for opening Checkout Pro. If you want to customize the way the checkout will be opened, see the section Opening Schema
Check out the full integration example on GitHub for PHP or NodeJS to download a basic project for quick implementation from Checkout Pro.
To install the SDK, you must run the following code in your terminal command line using Composer: