{"section":"tutorials","requestedLocale":"en","requestedSlug":"setting-up-payments-with-easypay-marketplace","locale":"en","slug":"setting-up-payments-with-easypay-marketplace","path":"docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace.md","branch":"main","content":"On VTEX, you can integrate with the easypay payment provider. This connector enables your store to sell using easypay, MBWay, and MultiBanco.\n\nTo use the easypay affiliation in your marketplace, you need to:\n\n- [Install the easypay app](#install-the-easypay-app)\n- [Configure the easypay app](#configure-the-easypay-app)\n- [Configure the easypay webhook](#configure-the-easypay-webhook)\n- [Configure the easypay affiliation](#configure-the-easypay-affiliation) \n\n> ⚠️ If your store is not a marketplace, read [Setting up payment with easypay](/en/docs/tutorials/setting-up-payments-with-easypay) or [Setting up payments with easypay seller](/en/docs/tutorials/setting-up-payments-with-easypay-seller).\n\n## Install the easypay app\n\nTo install the easypay app, follow the steps below:\n\n1. In the [VTEX IO CLI](https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install), run the command `vtex login accountname` to log in to your account.\n2. Install the easypay app using the `vtex install easypaypartnerpt.payment-provider-easypay` command. \n\n## Configure the easypay app\n\nAfter installing the easypay app, you need to configure it. To access the settings screen, follow the steps below:\n\n1. In the VTEX Admin, go to __Extensions Hub > App Management__, or type __App Management__ in the search bar at the top of the page.\n2. Find the __Easypay Payment Provider__ app and click __Settings__.\n\nConfiguration is divided in four sections:\n\n- [easypay credentials (required)](#easypay-credentials)\n- [Payment (required)](#payment)\n- [Customizing the easypay checkout (required)](#customizing-the-easypay-checkout)\n- [Sandbox mode](#sandbox-mode)\n\n![easypay_pt_1](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_1.png)\n\n> ⚠️ You must set up the following configurations in the [easypay environment](https://backoffice.easypay.pt/). easypay controls these settings, therefore, VTEX does not guarantee that the steps below will be permanently updated. Use this document as a reference and check your [easypay environment](https://backoffice.easypay.pt/) for up-to-date information.\n\n### easypay credentials\n\nThe information in this section must be completed.\n\n__Key ID e Key Value__: easypay key value and ID.\n\n
1. In the [easypay environment](https://backoffice.easypay.pt/), click the easypay logo in the top left corner of the screen and the arrow of the marketplace account.\n\n![easypay_pt_10](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_2.PNG)\n\n
2. Go to **Web Services > Configuration API 2.0 > Keys**.\n\n
3. In the **Alias** menu, **Create Payment Details** option, click **Keys**.\n\n![easypay_en_11](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_3.png)\n\n
4. Copy and save the **ID** and **Key** information. To create a new key, click **+ New**.\n\n![easypay_en_12](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_4.png)\n\n__Merchant account UID__: identification of the merchant account where purchase amounts from store sales will be deposited. If there is no separate merchant account, you can use the \"Account UID\" of the payment account.\n\n
1. In the [easypay environment](https://backoffice.easypay.pt/), click the easypay logo in the top left corner of the screen, then click the arrow on the \"MERCHANT 1\" account.\n\n![easypay_pt_5](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_5.PNG)\n\n
2. Copy and save the **Account UID** information.\n\n![easypay_en_6](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_6.png)\n\n__Margin account UID__: identification of the margin account. \n\n1. In the side menu of the [easypay environment](https://backoffice.easypay.pt/), click __Beneficiary__.\n2. Copy the information and save the __Account UID__ information available in __Margin Account__.\n\n![easypay_en_13](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_7.png)\n\n__Refund account ID and Refund account key__: easypay refund keys ID and value.\n\n
1. In the [easypay environment](https://backoffice.easypay.pt/) side menu, go to **Web Services > Configuration API 2.0 > Keys**.\n\n
2. In the **Alias** menu, **Margin Account**, click **Keys**.\n\n![easypay_en_14](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_8.png)\n\n
3. Click **+ New**.\n\n![easypay_en_15](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_9.png)\n\n
4. Complete the **Name** field with the **Refund Account**.\n\n![easypay_en_16](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_10.png)\n\n
5. Click **Save**.\n\n
6. Copy and save the **ID** and **Key** information.\n\n![easypay_pt_17](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_11.png)\n\n> ⚠️ Refunds are debited directly from a marketplace account. Later, the marketplace must request the refunded amount from the seller.\n\n### Payment\n\nIn this section, you must indicate whether your store will use asynchronous and/or synchronous payments. See the easypay documentation to check the available [payment methods](https://docs.quality-utility.aws.easypay.pt/concepts/payment-methods) and their identification [acronyms](https://docs.quality-utility.aws.easypay.pt/checkout/reference).\n\n![easypay_en_7](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_12.png)\n__Accepted asynchronous payment types__: asynchronous payment methods available to the customer. Only enter the acronyms of the asynchronous payment types, separated by commas without periods or spaces.\n\nExample:\n\n| Correct | Incorrect |\n| ---------------- | ---------------- |\n| mb,dd,vi | mb, dd, vi |\n\n> ⚠️ If you complete this field, you must also complete the **Expiration days for asynchronous payments** field.\n\n__Accepted synchronous payment types__: synchronous payment methods available to the customer. Only enter the acronyms of the synchronous payment types, separated by commas without periods or spaces.\n\nExample:\n\n| Correct | Incorrect |\n| ---------------- | ---------------- |\n| cc,mbw | cc, mbw |\n\n__Expiration days for asynchronous payments__: expiration period, in days, for asynchronous payments. Only enter the desired number of days.\n\nExample:\n\n| Correct | Incorrect |\n| ---------------- | ---------------- |\n| 10 | 10 days, Dec, or 05/10/2023 |\n\n### Customizing the easypay checkout\n\neasypay has a native checkout layout configured in the app. See below:\n\n![easypay_en_8](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_13.png)\n\nIf you want to customize easypay's native checkout, complete one or more fields in this section:\n\n- __Checkout logo URL__: logo displayed at the easypay checkout. Enter the link to the image you want to use\n- __Checkout background color__: background color. Enter the HEX code of the desired color. Native default: #ffffff.\n- __Checkout accent color__: highlight color, button pattern, and input borders. Enter the HEX code of the desired color. Native default: #0d71f9.\n- __Checkout error color__: error message color. Enter the HEX code of the desired color. Native default: #ff151f.\n- __Checkout input background color__: input background color. Enter the HEX code of the desired color. Native default: transparent.\n- __Checkout input border color__: input border color. Enter the HEX code of the desired color. Native default: the same color used in the __accent color__.\n- __Checkout input border radius__: allows you to define the rounded borders of the inputs. Enter the desired value in pixels (numbers only). Native default: 50 pixels.\n\nExample:\n\n| Correct | Incorrect |\n| ---------------- | ---------------- |\n| 35 | 35px |\n\n- __Checkout button background color__: background color of the buttons. Enter the HEX code of the desired color. Native default: the same color used in the __accent color__.\n- __Checkout button border radius__: allows you to set the rounded borders of the buttons. Enter the desired value in pixels (numbers only). Native default: 50 pixels.\n\nExample:\n\n| Correct | Incorrect |\n| ---------------- | ---------------- |\n| 30 | 30px |\n\n- __Checkout button box shadow__: option to enable or disable the button shadow.\n- __Checkout font family__: fonts used in texts. Enter the generic family name, web-safe font, or font link. Native default: Overpass. Example, correct: sans-serif, verdana, ou https://fonts.gstatic.com/s/overpass/v12/qFda35WCmI96Ajtm83upeyoaX6QPnlo6_PPbM5qKl8Kuo8AzesE.woff2\n\n- __Checkout base font size__: allows you to set the font size in the root element. Enter the desired value in pixels (numbers only). Native default: 10 pixels.\n\nExample:\n\n| Correct | Incorrect |\n| ---------------- | ---------------- |\n| 11 | 11px |\n\n> ⚠️ Do not use fonts over 12 pixels, as they can blur the layout.\n\n### Sandbox mode\n\nTo enable the development test environment, select the __Enable sandbox mode__ option. You must use test credentials.\n\nAfter completing the configuration fields, click __Save__.\n\n## Configure the easypay webhook\n\nTo configure the easypay webhook, follow the steps below:\n\n
1. In the [easypay environment](https://backoffice.easypay.pt/), click the easypay logo in the top left corner of the screen, then click the arrow of the desired marketplace account.\n\n![easypay_pt_2](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_14.PNG)\n\n
2. Go to **Web Services > URL Configuration**.\n\n
3. In **URL: Notify**, use the link below, adding the name of your store.\n\n`https://{your-account-name}.myvtex.com/_v/easypaypartnerpt.payment-provider-easypay/webhook`\n\n![easypay_en_9](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/payments/payment-settings/setting-up-payments-with-easypay-marketplace_15.png)\n\n> ⚠️ If there is more than one payment account in your marketplace, add a link to each of the existing accounts.\n\n
4. Click **Submit**.\n\n## Configure the easypay affiliation\n\nTo configure the easypay affiliation, follow the steps below:\n\n1. In the VTEX Admin, go to __Store Settings > Payment > Settings__, or type __Settings__ in the search bar at the top of the page.\n2. In the __Gateway Affiliations__ tab, click the `+` button.\n3. Click the __easypay__ connector.\n4. Complete the __App Key__ and __App Token__ fields with your easypay account information.\n5. If you wish to modify the identification name to be displayed for the easypay provider on the VTEX Admin screen, enter the information in the __Name__ field in __Basic Information__.\n6. In __Payment Control__, select whether you want to activate the provider in a test environment by clicking __Enable test mode__.\n7. If you want to use [payment split](/en/docs/tutorials/split-payment) in your store, select the option __Enable payout split and send payment recipients__ and indicate the __Accountable for payment processing charges__ and __Accountable for chargebacks__ (marketplace, sellers or marketplaces and sellers).\n8. Click `Save`.\n\nTo configure the payment methods that easypay will process, read the [Configuring payment conditions](/en/docs/tutorials/how-to-configure-payment-conditions) article.\n\nTo set special conditions for payment methods, read [Configuring payment special conditions](/en/docs/tutorials/special-conditions).\n\nAfter following the instructions, it can take up to 10 minutes for the easypay connector to be displayed as a payment option at your store checkout. \n(https://help.vtex.com/pt/tutorial/condicoes-especiais--tutorials_456#)."}