Integrate Smart Checkout

How do I integrate?

Integration

  1. Generate your preference

    1.1 Add the SDK downloaded from Mercado Pago in your project.

    1.2 Add the credentials to enable the use of the Mercado Pago SDK.

    1.3 Set the preference according to your product or service.

  2. Add the checkout to your website

Steps to integrate

Installing the Smart Checkout consists of two steps:

1. Generate your preference

Write the following code consisting of three parts:

1.1 Add the Mercado Pago SDK in your project:

<?php
// Mercado Pago SDK
require __DIR__ .  '/vendor/autoload.php';
?>
// Mercado Pago SDK
const mercadopago = require ('mercadopago');
// Mercado Pago SDK
import com.mercadopago.MercadoPago;
# Mercado Pago SDK
require 'mercadopago.rb'
// Mercado Pago SDK
 using MercadoPago;



1.2 Add the credentials to enable the use of the Mercado Pago SDK:

<?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.MercadoPago;

// Add Your credentials
MercadoPago.SDK.setAccessToken("PROD_ACCESS_TOKEN");
# Mercado Pago SDK
require 'mercadopago.rb'

# Add Your credentials
$mp = MercadoPago.new('PROD_ACCESS_TOKEN')
// Mercado Pago SDK
using MercadoPago;

// Add Your credentials
MercadoPago.SDK.AccessToken = "PROD_ACCESS_TOKEN";



1.3 Set the preference according to your product or service:

<?php
// Mercado Pago SDK
require __DIR__ .  '/vendor/autoload.php';

// Add Your credentials
MercadoPago\SDK::setAccessToken('PROD_ACCESS_TOKEN');

// 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();
?>
// Mercado Pago SDK
const mercadopago = require ('mercadopago');

// Add Your credentials
mercadopago.configure({
  access_token: 'PROD_ACCESS_TOKEN'
});

// 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 "<%= @init_point %>" in your HTML
  global.init_point = response.body.init_point;
}).catch(function(error){
  console.log(error);
});
// Mercado Pago SDK
import com.mercadopago.MercadoPago;

// Add Your credentials
MercadoPago.SDK.setAccessToken("PROD_ACCESS_TOKEN");

// Create a preference object
Preference preference = new Preference();

// Create a preference item
Item item = new Item();
item.setTitle("My Item")
    .setQuantity(1)
    .setUnitPrice((float) 75.56);
preference.appendItem(item);
preference.save();
# Mercado Pago SDK
require 'mercadopago.rb'

# Add Your credentials
$mp = MercadoPago.new('PROD_ACCESS_TOKEN')

# Create a preference object
preference_data = {
  "items": [
    {
      "title": "My Item",  
      "unit_price": 100,
      "quantity": 1
    }
  ]
}
preference = $mp.create_preference(preference_data)

# This value replaces the String "<%= @preference_id %>" in your HTML
@preference_id = preference["response"]["id"]
// Mercado Pago SDK
using MercadoPago;

// Add Your credentials
MercadoPago.SDK.AccessToken = "PROD_ACCESS_TOKEN";

// Create a preference object
Preference preference = new Preference();

// Create a preference item
preference.Items.Add(
  new Item()
  {
    Title = "My Item",
    Quantity = 1,
    CurrencyId = CurrencyId.UYU,
    UnitPrice = (decimal)75.56
  }
);
preference.Save()"
curl -X POST \
  'https://api.mercadolibre.com/checkout/preferences?access_token="**PROD_ACCESS_TOKEN**"' \
  -H 'Content-Type: application/json' \
  -H 'cache-control: no-cache' \
  -d '{
    "items": [
        {
            "title": "My Item",
            "quantity": 1,
            "unit_price": 75.76
        }
    ]
}'

2. Add the checkout to your website

Finally, add the following code to show the payment button of your Smart Checkout in the place you want it to appear.

<form action="/payment-process" method="POST">
  <script
   src="https://www.mercadopago.com.uy/integrations/v1/web-payment-checkout.js"
   data-preference-id="<?php echo $preference->id; ?>">
  </script>
</form>
<form action="/payment-process" method="POST">
  <script
   src="https://www.mercadopago.com.uy/integrations/v1/web-payment-checkout.js"
   data-preference-id="$$id$$">
  </script>
</form>
<form action="/payment-process" method="POST">
  <script
   src="https://www.mercadopago.com.uy/integrations/v1/web-payment-checkout.js"
   data-preference-id="${preference.id}">
  </script>
</form>
<form action="/payment-process" method="POST">
  <script
   src="https://www.mercadopago.com.uy/integrations/v1/web-payment-checkout.js"
   data-preference-id="<%= @preference_id %>">
  </script>
</form>
<form action="/payment-process" method="POST">
  <script
   src="https://www.mercadopago.com.uy/integrations/v1/web-payment-checkout.js"
   data-preference-id="@Html.DisplayFor(model => model.id)">
  </script>
</form>

Important

Do not forget to access from another browser or log out of your Mercado Pago account before testing it. You cannot make a payment with the same account you created the payment form.

Excellent! You finished your integration.

Click on the link within your site and test the integration of your Smart Checkout..

Note

This documentation refers to the new version of the Smart Checkout. To view the previous version, go to the old Smart Checkout section.


Next steps

La búsqueda no arrojó ningún resultado.

Verifica la la ortografía de los términos de búsqueda o prueba con otras palabras clave.