# MD for: https://www.mercadopago.com.uy/developers/en/docs/salesforce-commerce-cloud/install-and-configure-cartridge.md

\# Install and configure the cartridge To install the Mercado Pago :toolTipComponent\[cartridge\]{content="In Salesforce Commerce Cloud, a cartridge is a code module that contains files, logic, and configurations necessary to add or modify functionalities of an SFCC store"} in your Salesforce Commerce Cloud store, follow the steps below. :::AccordionComponent{title="Deploy the storefront" pill="1"} If this is the first time you access the store, you will need to deploy the \_storefront\_. \*\*Otherwise, you can skip this step\*\*. 1\. In your Salesforce Commerce Cloud store, within the \*\*Administration\*\* section, go to \*\*Site Development > Site Import & Export\*\* in the left side menu. 2\. In the \*\*Import\*\* menu, select the option \*\*Storefront Reference Architecture Demo Sites\*\*. !\[Example of Storefront Reference Architecture Demo Sites option\](https://www.mercadopago.com.uy/images/salesforce/storefront-reference-architecture-demo-sites-v1.png) 3\. In the table, select the option \*\*Storefront Reference Architecture base\*\* and click the \*\*Deploy\*\* button. !\[Example of Base Storefront Reference Architecture option\](https://www.mercadopago.com.uy/images/salesforce/Storefront-reference-architecture-base-en-v1.png) 4\. Next, go to \*\*Administration > Site Development > Code Deployment\*\* in the left side menu. 5\. In \*\*Code Version Management\*\*, select the active code version and download it. !\[Example of code version\](https://www.mercadopago.com.uy/images/salesforce/code-version-en-v1.png) ::: :::AccordionComponent{title="Download the latest active version of your store" pill="2"} 1\. In your store, within the \*\*Administration\*\* section, go to \*\*Site Development > Code Deployment\*\* in the left side menu. 2\. Click on the most recent active version of your store. !\[download store version\](https://www.mercadopago.com.uy/images/salesforce/download-store-version-v1.png) 3\. In \*\*Version Summary\*\*, click \*\*Download\*\*. !\[download store version - button\](https://www.mercadopago.com.uy/images/salesforce/download-store-version-2-v1.png) 4\. Finally, unzip the \_.zip\_ file you downloaded. With this, you have downloaded the latest version of your store. You can now proceed to download the Mercado Pago cartridge. ::: :::AccordionComponent{title="Download the Mercado Pago cartridge" pill="3"} 1\. Access the \[Salesforce Partner Marketplace\](https://www.salesforce.com/products/commerce-cloud/partner-marketplace/partners/mercado-pago/) and search for "Mercado Pago". 2\. Click on \*\*Mercado Pago Cartridge for B2C Commerce\*\*. Once inside the cartridge site, click \*\*Get It Now\*\*. !\[marketplace-salesforce\](https://www.mercadopago.com.uy/images/salesforce/salesforce-cartridge-market-v1.png) 3\. You will see a redirect notice to the official Mercado Pago repository on GitHub, where you must indicate that you accept the terms and conditions and click \*\*Visit Provider\*\*. 4\. Inside the repository, follow the instructions in the \*\*README\*\* section to download the latest version of the \`int\_mercadopago\` cartridge. 5\. Finally, unzip the \_.zip\_ file you downloaded. With this, the Mercado Pago cartridge has been downloaded and you can proceed with integrating it into your store. ::: :::AccordionComponent{title="Integrate the store with the cartridge" pill="4"} In this step, you will connect your store with the Mercado Pago cartridge. To do this, you must first store the Mercado Pago cartridge on the store site. 1\. Open the Mercado Pago cartridge folder obtained in step 2 and navigate to the \*\*cartridges\*\* folder. 2\. Open the folder you downloaded with the latest version of your store and copy all its contents. 3\. Paste your store folders inside the \*\*cartridges\*\* folder. This way, the \*\*int\_mercadopago\*\* folder must be at the same level as your store folders. !\[How to save the Mercado Pago cartridge\](https://www.mercadopago.com.uy/images/salesforce/folders-v1.png) Next, integrate the Mercado Pago cartridge with your store so that it maintains its functionality alongside other installed cartridges. To do this, follow these steps: 1\. Open a Terminal or CMD and access the \*\*int\_mercadopago\*\* folder. 2\. Execute the following commands: \`\`\`bash npm install npm run build \`\`\` With this, the cartridge has been integrated into the store site and you can proceed with configuring the connection between the local development environment and Salesforce. ::: :::AccordionComponent{title="Configure connection of the local development environment" pill="5"} At the beginning of the integration, the project must be prepared and connected to the Salesforce Commerce Cloud test environment using a WebDAV-compatible tool (protocol for file management via HTTP), such as \*\*Prophet Debugger\*\* or similar. Follow the steps below: 1\. If you don't have one yet, create an \*\*Access Key\*\* following the instructions below. If you already have one, skip this step. 1\. Go to \*\*My Profile\*\* and, in the \*\*Credentials\*\* column, click \*\*Manage Access Keys\*\*. 2\. In the \*\*Scope\*\* column, select \*\*WebDAV File Access and UX Studio\*\* to obtain development permissions. 3\. Click on \*\*Generate access key\*\*. !\[How to create the access key\](https://www.mercadopago.com.uy/images/salesforce/create-access-key-en-v1.png) 2\. In the project root, create a file named \*\*"dw.json"\*\* and add the following content, filling in each field with your store information: \`\`\`json { "hostname": "sandbox host", "username": "email", "password": "WebDAV password", "code-version": "directory" } \`\`\` | Parameter | Type | Description | |---|---|---| | \`hostname\` | string | The sandbox host address can be obtained by accessing \[Swagger UI\](https://admin.dx.commercecloud.salesforce.com/#/Sandboxes/post\_sandboxes\_\_sandboxId\_\_operations) and performing a \*\*GET\*\* on the \`sandboxes\` \_endpoint\_. | | \`username\` | string | User email for connection (usually the account \_login\_). | | \`password\` | string | To create a WebDAV password, in the Salesforce sandbox administration panel, go to \*\*My Profile > Manage Access Keys\*\*. In this menu, click \*\*Generate Access Key\*\* and create a password of type \*\*"WebDAV File Access and UX Studio"\*\*. | | \`code-version\` | string | To verify the directory, in the Salesforce sandbox administration panel, go to \*\*Administration > Site Development > Code Deployment\*\* and enter the \*\*"Code Version"\*\* that is active for that \_sandbox\_. | 3\. In the project root, create a folder named \*\*".vscode"\*\* and inside it, create a file named \*\*"launch.json"\*\* with the following content: \`\`\`json { "version": "0.1.0", "configurations": \[ { "type": "prophet", "request": "launch", "name": "Attach to Sandbox" } \] } \`\`\` Done, you now have the local development environment connected with Salesforce and can proceed with configuring the cartridge. ::: :::AccordionComponent{title="Configure the cartridge" pill="6"} To activate the \`int\_mercadopago\` cartridge and use it as a payment processor, follow these steps. 1\. Go to the Salesforce Commerce Cloud configuration panel, in \*\*Administration > Sites > Manage Sites\*\*. 2\. Select your site and click on the \*\*Settings\*\* tab. 3\. In the \*\*Cartridges\*\* option, add \`int\_mercadopago\` to the list before \`app\_storefront\_base\`, separating the values by colons. The result should be as shown in the following image. !\[cartridges-salesforce\](https://www.mercadopago.com.uy/images/salesforce/cartridge-config-v1.png) 4\. Click \*\*Apply\*\* to save the changes. After completing this configuration, Mercado Pago will appear as an available payment method in your store. Follow the next step to add the payment methods. ::: :::AccordionComponent{title="Add payment methods" pill="7"} In this step you will be able to upload the \*\*"metadata"\*\* file to your store in Salesforce Commerce Cloud and, in this way, add the payment methods that Mercado Pago offers. 1\. Open the cartridge folder you obtained in step 2, go to the \*\*metadata\*\* folder and compress it into a \_.zip\_ file. !\[metadata\](https://www.mercadopago.com.uy/images/salesforce/metadata-v1.png) 2\. Go to the Salesforce Commerce Cloud configuration panel, in \*\*Administration > Site Development > Site Import & Export\*\*. 3\. In the \*\*Import\*\* menu, click \*\*Select File\*\*, choose the \`metadata.zip\` file and, then, click \*\*Upload\*\*. When prompted, confirm the action by clicking \*\*Ok\*\*. 4\. The upload confirmation can be verified in the \*\*Status\*\* menu, located at the end of the page. Use the \*\*Refresh\*\* button to reload, if necessary. When you see the \`metadata.zip\` file within the \*\*Status\*\* menu, the configuration will be ready. You can now continue with configuring Mercado Pago credentials. ::: :::AccordionComponent{title="Configure Mercado Pago credentials" pill="8"} You must link your Mercado Pago account through credentials. During the integration stage, you must use the :toolTipComponent\[test account credentials\]{content="Access keys that identify your test user, used in development stages or to test the integration."} that you obtained in \[Create application\](https://www.mercadopago.com.uy/developers/en/docs/salesforce-commerce-cloud/create-application). Follow the steps below. 1\. Go to the Salesforce Commerce Cloud configuration panel, in \*\*Administration > Merchant Tools > Site Preferences > Custom Preferences\*\*. 2\. In the \*\*Custom Site Preference Groups\*\* screen you will see the Mercado Pago configuration list. Click on the \*\*MercadoPagoCredentials\*\* ID. 3\. In the \*\*Instance Type\*\* field, select \*\*Sandbox\*\*. 4\. Inside the \*\*Mercado Pago Credentials\*\* screen, complete the fields as appropriate: | Field | Description | |---|---| | Instance type | Determines whether the store is in test or production state. Since you are in the development stage, select \*\*Sandbox\*\*. | | Public Key | This field refers to the \_Public Key\_ of the Mercado Pago application. Since you are in the development stage, you must use the :toolTipComponent\[\_Public Key\_ of the test user application\]{content="Public key of the test user application, which is used on the frontend to access information and encrypt data, whether in the development or testing stage. You can access it by logging in with your test user and going to \*Your integrations > Application details > Production > Production credentials\*"}. Later, you can change it to a production one. | | Access Token | This field refers to the \_Access Token\_ of the Mercado Pago application. Since you are in the development stage, you must use the :toolTipComponent\[\_Access Token\_ of the test user application\]{content="Private key of the test user application, which is used in the backend to test your development. You can access it by logging in with your test user and going to \*Your integrations > Application details > Production > Production credentials\*"}. Later, you can change it to a production one. | 5\. Click \*\*Save\*\* to confirm the configuration. !\[credentials in Salesforce\](https://www.mercadopago.com.uy/images/salesforce/credentials-salesforce-v1.png) Done! You have now linked your Mercado Pago account with your store in Salesforce Commerce Cloud. You can proceed with verifying the installation. ::: :::AccordionComponent{title="Verify Mercado Pago installation" pill="9"} To verify that the Mercado Pago cartridge is correctly installed, follow these steps. 1\. Go to the Salesforce Commerce Cloud configuration panel, in \*\*Administration > Merchant Tools > Ordering > Payment Processors\*\*. 2\. Verify that the Mercado Pago payment processors are within the table, in the \*\*Processor ID\*\* column. !\[verify the cartridge\](https://www.mercadopago.com.uy/images/salesforce/payments-processors-v1.png) Done, you have now installed and configured the Mercado Pago cartridge. Next, proceed with \*\*Payment Methods Configuration\*\*. :::