[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides payments integration payment provider framework in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/updates/release-notes)

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/vtex-platform-overview)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/getting-started)

---

Integration Guides

[Back office integration guide (ERP/PIM/WMS)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/erp-integration-guide)

[Customer Credit](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/customer-credit-integration-guide)

[External Marketplace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/external-marketplace-integration-guide)

[External Seller](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/external-seller-integration-guide)

[Gift Card](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/gift-card-integration-guide)

[Headless commerce](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/headless-commerce)

[Login (SSO)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/login-integration-guide)

[Punchout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/punchout)

[Offer Management Integration Guide](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/sent-offers-integration-guide-connectors)

[Payments](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-guide)

[Integrating a new payment provider on VTEX](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/integrating-a-new-payment-provider-on-vtex)

[Payment Provider Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-protocol)

[Payment Provider Protocol for Point of Sale (POS) - VTEX Sales App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-ppp-applied-to-pos)

[Implementing a Payment Provider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-implementing-a-payment-provider)

[Payment Provider Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework)

[Purchase Flows](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-purchase-flows)

[Payment App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-app)

[Payment Methods](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-methods)

[Payment Provider Homologation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-homologation)

[Antifraud Provider Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/how-the-integration-protocol-between-vtex-and-antifraud-companies-works)

[PCI - DSS Compliance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-pci-dss-compliance)

[Secure Proxy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-secure-proxy)

[Split Payouts on Payment Provider Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/split-payouts-on-payment-provider-protocol)

[Layout Development Guide for payment methods in Smart Checkout VTEX](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/layout-development-guide-for-payment-methods-in-smart-checkout-vtex)

[Custom Auto Capture Feature](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/custom-auto-capture-feature)

[Pix: Instant Payments in Brazil](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-pix-instant-payments-in-brazil)

[PSE Payment Method](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/pse-payment-method)

[Google Pay: processing information for payment providers and anti-fraud](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/google-pay-processing-information-for-payment-providers-and-anti-fraud)

[Search Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/search-integration-guide)

[Session Manager](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/session-manager)

[Tax Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/tax-service-integration-guide)

[Pricing Hub](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/pricing-hub)

[reCAPTCHA](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/recaptcha)

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/checkout-api-overview)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/updates/release-notes)

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/vtex-platform-overview)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/getting-started)

---

Integration Guides

[Back office integration guide (ERP/PIM/WMS)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/erp-integration-guide)

[Customer Credit](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/customer-credit-integration-guide)

[External Marketplace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/external-marketplace-integration-guide)

[External Seller](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/external-seller-integration-guide)

[Gift Card](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/gift-card-integration-guide)

[Headless commerce](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/headless-commerce)

[Login (SSO)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/login-integration-guide)

[Punchout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/punchout)

[Offer Management Integration Guide](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/sent-offers-integration-guide-connectors)

[Payments](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-guide)

[Integrating a new payment provider on VTEX](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/integrating-a-new-payment-provider-on-vtex)

[Payment Provider Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-protocol)

[Payment Provider Protocol for Point of Sale (POS) - VTEX Sales App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-ppp-applied-to-pos)

[Implementing a Payment Provider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-implementing-a-payment-provider)

[Payment Provider Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework)

[Purchase Flows](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-purchase-flows)

[Payment App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-app)

[Payment Methods](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-methods)

[Payment Provider Homologation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-homologation)

[Antifraud Provider Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/how-the-integration-protocol-between-vtex-and-antifraud-companies-works)

[PCI - DSS Compliance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-pci-dss-compliance)

[Secure Proxy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-secure-proxy)

[Split Payouts on Payment Provider Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/split-payouts-on-payment-provider-protocol)

[Layout Development Guide for payment methods in Smart Checkout VTEX](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/layout-development-guide-for-payment-methods-in-smart-checkout-vtex)

[Custom Auto Capture Feature](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/custom-auto-capture-feature)

[Pix: Instant Payments in Brazil](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-pix-instant-payments-in-brazil)

[PSE Payment Method](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/pse-payment-method)

[Google Pay: processing information for payment providers and anti-fraud](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/google-pay-processing-information-for-payment-providers-and-anti-fraud)

[Search Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/search-integration-guide)

[Session Manager](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/session-manager)

[Tax Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/tax-service-integration-guide)

[Pricing Hub](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/pricing-hub)

[reCAPTCHA](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/recaptcha)

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/checkout-api-overview)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides)

Integration Guides

[Payments](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-guide)

[Payment Provider Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework)

Payment Provider Framework

Payment Provider Framework (PPF) is an alternative way to develop payment connectors for your integration through VTEX IO. Since the development is based on a boilerplate of an IO app, a lot of the work is already done to implement the needed feature including the [API routes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payment-provider-protocol-api-overview), the types used in the request and response bodies, and the [Secure Proxy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-secure-proxy). With PPF, developers also do not need to worry about hosting the connector since it is hosted on the IO infrastructure.

> To develop a new payment connector, it is mandatory to follow the **prerequisites determined by VTEX**. You can learn about them in the [Implementation prerequisites section of our Payment Provider Protocol article](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/payment-provider-protocol--RdsT2spdq80MMwwOeEq0m%23implementation-prerequisites). For more information on how payment providers can be integrated into VTEX, visit [Integrating a new payment provider on VTEX](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/integrating-a-new-payment-provider-on-vtex).

## Getting started

### Cloning base repository

If you are starting a brand new project, we recommend you to clone the [example repository](https://read.calvincode.net/reader?url=https://github.com/vtex-apps/payment-provider-example), as it already has all the basic configuration setup.

### Updating your project

Once you have the repository code in your workspace, you have to make sure you have all the necessary dependencies and that they are updated. To do so, follow these steps:

1. Run the following command on your node folder:

`1

 yarn add @vtex/payment-provider

`

1. Go to your `package.json` and make sure it has been added as a dependency with the correct version:

`1

 "@vtex/payment-provider": "1.x"

`

1. Check in the `package.json` the version of `@vtex/api`, which should be listed in the devDependencies as follows:

`1

 "@vtex/api": "6.x"

`

1. When linking your app, this version might get updated to a later than 6.x version, which is fine. In case it is not listed as a `devDependency`, run the following command on your node folder:

`1

 yarn add -D @vtex/api

`

> If you get any type errors or conflicts in your project related to `@vtex/api`, follow these steps: 1\. Delete the `node_modules` folder and the `yarn.lock` file from both your project root and your project's node folder. 2\. Run the command `yarn install -f` in both folders.

1. In your `manifest.json`, you should check the builders section, in which you must include the `paymentProvider` in its current version. This will add policies to callback the Payment Gateway APIs and also expose Payment Provider protocol routes.

`1

"builders": {

2

 "node": "6.x",

3

 "paymentProvider": "1.x"

4

}

`

## Next steps

In order to create your service, you must implement your [payment provider connector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework%23payment-provider) and the [service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework%23payment-provider-service) itself, as described in the sections below.

## Payment Provider

This is an abstract class with the signatures of the route functions required in your connector, according to the [protocol](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/payment-provider-protocol).

You must create a new class extending the Payment Provider, which must implement a function for each route. The functions will receive the request body (when there is one) as a parameter and the response must be returned as an object, such as the example shown below:

`1

import {

2

 PaymentProvider,

3

 // ...

4

} from '@vtex/payment-provider'

5

6

class YourPaymentConnector extends PaymentProvider {

7

8

 // ... implementation of the other routes functions

9

}

`

> Typescript should automatically check for typing errors, but if you need, you can check the requests and responses signatures from the [Payment Flow endpoints in our API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/api-reference/payment-provider-protocol%23get-/manifest).

### Payment Provider builder

To specify which payment methods the connector will accept to process, follow the steps below:

1. Create a folder named `paymentProvider` using the following folder structure.

`1

node

2

paymentProvider

3

manifest.json

`

1. Create a file named `configuration.json` inside the `paymentProvider` folder.

`1

node

2

paymentProvider

3

 |--configuration.json

4

manifest.json

`

1. Declare the payment methods accepted by your payment provider. This action allows them to be implemented automatically by the builder, without the need to declare them in the `/manifest` route.

`1

{

2

 "name": "MyConnector",

3

 "paymentMethods": [

4

 {

5

 "name": "Visa",

6

 "allowsSplit": "onCapture"

7

 },

8

 {

9

 "name": "American Express",

10

 "allowsSplit": "onCapture"

11

 },

12

 {

13

 "name": "Diners",

14

 "allowsSplit": "onCapture"

15

 },

16

 {

17

 "name": "Elo",

18

 "allowsSplit": "onCapture"

19

 },

20

 {

21

 "name": "Hipercard",

22

 "allowsSplit": "onCapture"

23

 },

24

 {

25

 "name": "Mastercard",

26

 "allowsSplit": "onCapture"

27

 },

28

 {

29

 "name": "BankInvoice",

30

 "allowsSplit": "onAuthorize"

31

 }

32

 ]

33

}

`

> The `name` field indicating the name of the connector must be replaced with the name of your provider. This field cannot be filled with a value `"MyConnector"`.

> To check which payment methods are currently available in the VTEX Admin, go to Store **Settings > Payment > Settings**, or type **Settings** in the search bar at the top of the page and click the green `+` button. If you want to support a new payment method that is not available, you need to [open a ticket to the VTEX team](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/opening-tickets-to-vtex-support--16yOEqpO32UQYygSmMSSAM) informing them of this new payment method.

You can also declare the `customFields` array to allow your payment provider to send specific information. The `type` field can be configured as follows: `text` for non-confidential data; `password` for sensitive and security information (except `appKey` and `AppToken` which should not be sent in this field); and `select` to group a set of custom information.

`1

{

2

 "name": "MyConnector",

3

 "paymentMethods": [

4

 ...

5

 ],

6

 "customFields": [

7

 {

8

 "name": "Company account",

9

 "type": "text"

10

 },

11

 {

12

 "name": "POS URL",

13

 "type": "text"

14

 },

15

 {

16

 "name": "Client key",

17

 "type": "password"

18

 },

19

 {

20

 "name": "Auto Capture Settings",

21

 "type": "select",

22

 "options": [

23

 {

24

 "text": "Automatic Capture Immediately After Payment Authorization",

25

 "value": "Immediately"

26

 },

27

 {

28

 "text": "Auto Settle Delay: 7 Days",

29

 "value": "Deactivated"

30

 }

31

 ]

32

 }

33

 ]

34

}

`

### Overriding the Manifest route

If you wish to override the default `/manifest` route due to some specific feature of your provider, please [open a ticket to the VTEX support team](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/opening-tickets-to-vtex-support--16yOEqpO32UQYygSmMSSAM) describing your use case and add special parameters as specified below.

`1

{

2

 "memory": 256,

3

 "ttl": 10,

4

 "timeout": 10,

5

 "minReplicas": 2,

6

 "maxReplicas": 3,

7

 "routes": {

8

 "manifest": {

9

 "path": "/_v/api/my-connector/manifest",

10

 "handler": "vtex.payment-gateway@1.x/providerManifest",

11

 "headers": {

12

 "x-provider-app": "$appVendor.$appName@$appVersion",

13

 },

14

 "public": true

15

 }

16

 }

17

}

`

> The `x-provider-app` parameter must be updated whenever there is an important change (e.g. vtex.payment-provider-example@1.2.3). You can also omit the `handler` and `headers` parameters, however, when performing this procedure you will need to implement them yourself.

### Available Configurable Options

In addition to the manifest fields (`paymentMethods` and `customFields`), the following configuration options are available:

| Parameter name             | Required | Default                           | Description                                                                                |
| -------------------------- | -------- | --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| name                       | Yes      | Payment provider connector name.  |                                                                                |
| serviceUrl                 | Yes      | Auto-generated for IO connectors. | A valid URL (can include relative paths).                                                                                |
| implementsOAuth            | No       | false                             | Defines whether the provider implements the configuration flow with OAuth authentication support.                                                                                |
| implementsSplit            | No       | false                             | Defines whether the provider implements the payment split flow.                                                                                |
| usesProviderHeadersName    | No       | true                              | Defines whether the provider will receive appKey and appToken headers as "x-provider-api-appKey" and "x-provider-api-appToken" respectively.                                                                                |
| useAntifraud               | No       | false                             | Defines whether anti-fraud providers can be used in the payment provider's transactions.                                                                                |
| usesBankInvoiceEnglishName | No       | false                             | Defines if the Bank Invoice payment method will use the English name (true), or the Brazilian name (Boleto Bancário)(false).                                                                                |
| usesSecureProxy            | No       | true                              | If true, the provider can process payment without being [PCI-Certified](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-pci-dss-compliance). The connector will receive a secureProxyUrl on createPayment flow, and the card encrypted data. If false, the provider must be a PCI-Certified entity, and you should send the AOC containing the provided serviceUrl.                                                                                |
| requiresDocument           | No       | false                             | If true, the customer must include the cardholder document on Checkout. A new field will appear on the Checkout form. If false, the customer does not need to include a cardholder document.                                                                                |
| acceptSplitPartialRefund   | No       | false                             | If true, a partial refund will be sent when a payment split occurs. If false, the connector couldn't process a partial refund when a payment split occurs.                                                                                |
| usesAutoSettleOptions      | No       | false                             | If true, the client will be able to choose the behavior of the auto settlement in the VTEX admin configurations of the provider. The available options are as follows: "Use behavior recommended by the payment processor", "Automatic capture immediately after payment authorization", "Automatic capture immediately after anti-fraud analysis", "Scheduled: schedules the automatic capture" and "Deactivated: not automatically captured". If false, the connector will not have this dropdown configuration field for auto settlement. More information can be found in the [Custom Auto Capture Feature article](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/custom-auto-capture-feature). |

### Request a retry from Payment Gateway

A retry is required to develop your connector according to the [protocol](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/payment-provider-protocol), and for this action, the function below must be invoked:

`1

this.retry(request)

`

> More information about the retry flow can be found in the [Payment Authorization section of the Payment Provider Protocol article](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/payment-provider-protocol%23payment-authorization).

### Payment Provider Service

This is a class that extends the Service from `@vtex/api`. You must invoke it by passing the developed connector as a property of the first parameter and it will automatically set up the required routes for you.

The following code shows how to do this and find it in the `node/index.ts` file.

`1

import {

2

 PaymentProviderService,

3

} from '@vtex/payment-provider'

4

5

new PaymentProviderService({

6

 connector: YourPaymentConnector,

7

})

`

By default, the Payment Provider Service declares the following routes:

* `/manifest`
* `/payments`
* `/settlements`
* `/refunds`
* `/cancellations`
* `/inbound`

If your service requires any extra routes, you must declare them separately and use them as parameters:

`1

new PaymentProviderService({

2

 routes: newRoutes,

3

 connector: YourPaymentConnector,

4

})

`

If your connector requires any extra clients, you must also pass them in the parameters along with the connector:

`1

new PaymentProviderService({

2

 clients: NewClients,

3

 connector: YourPaymentConnector,

4

})

`

### Using Secure Proxy

For processing credit, debit or co-branded card transactions, integrations must be compliant with [PCI-DSS security standards](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-pci-dss-compliance). For integrations hosted in VTEX IO supporting one of those payment methods, it is mandatory to use Secure Proxy to make calls to a PCI-certified endpoint. You can check more details in the [Secure Proxy article](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-secure-proxy).

> The endpoint must be allowed by VTEX Secure Proxy. This must be [requested via ticket](https://read.calvincode.net/reader?url=https://help.vtex.com/support) sending the AOC with the wanted endpoint. Currently the Secure Proxy only accepts two Content-Types: You can use `\"application/json\"` or `\"application/x-www-form-urlencoded\"`. Any other Content-Type will not be supported.

To make calls over our Secure Proxy, you must:

1. Extend the `SecureExternalClient` abstract class. The constructor of the class is made in a way that VTEX allows `'http://my-pci-certified-domain.com'` as one of the trusted destinations by receiving its AOC.
2. Set the Secure Proxy URL on the request that you want to be proxied. `SecureProxyURL` is received on `createPayment` flow.

`1

import { SecureExternalClient, CardAuthorization } from '@vtex/payment-provider'

2

import type {

3

 InstanceOptions,

4

 IOContext,

5

 RequestConfig,

6

} from '@vtex/api'

7

8

export class MyPCICertifiedClient extends SecureExternalClient {

9

 constructor(protected context: IOContext, options?: InstanceOptions) {

10

 super('http://my-pci-certified-domain.com', context, options)

11

 }

12

13

 public myPCIEndpoint = (cardRequest: CardAuthorization) => {

14

 return this.http.post(

15

 'my-pci-endpoint',

16

 {

17

 holder: cardRequest.holderToken,

18

 number: cardRequest.numberToken,

19

 expiration: cardRequest.expiration,

20

 csc: cardRequest.cscToken

21

 },

22

 {

23

 headers: {

24

 Authorization: 'my-pci-endpoint-authorization',

25

 },

26

 secureProxy: cardRequest.secureProxyUrl,

27

 } as RequestConfig

28

 )

29

 }

30

}

`

## Placing an order with your new connector

Now that you have a new connector ready to be used, you can test it entirely in the production flow using your store's Checkout.

> The account must be allowed to test IO Connectors. This must be [requested via ticket](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/opening-tickets-to-vtex-support--16yOEqpO32UQYygSmMSSAM) informing the name of the app and the account where the tests will be made.

A prerequisite for this procedure is to have products for sale at your store for testing. To place an order with your new connector:

1. Launch a beta version of your connector. E.g.: `vtex.payment-provider-test@0.1.0-beta`. If you need, check the [Making your app publicly available article](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-10-making-your-app-publicly-available%23launching-a-new-version) to learn how to create a beta version of your app.
2. Install the beta version on `master` workspace. Wait for around 1 hour.
3. Go to `https://{account}.myvtex.com/admin/affiliations/connector/Vtex.PaymentGateway.Connectors.PaymentProvider.PaymentProviderConnector_{connector-name}/`. Replace `{account}` for the name of the account you want to test on and `{connector-name}` for the name of your connector. The format of the name is: `${vendor}-${appName}-${appMajor}` (e.g.: `vtex-payment-provider-example-v1`).
![{"base64":"  ","img":{"width":1048,"height":439,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":21325,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/Integration-Guides/payments-integration-guide/payments-integration-payment-provider-framework-0_370.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/Integration-Guides/payments-integration-guide/payments-integration-payment-provider-framework-0_370.png)
4. In **Payment Control**, activate the test environment by clicking **Enable test mode**. A new field called **Workspace** will appear.
5. Set the **Workspace** as you wish. You can leave it as `master` if it is the workspace you want to test on.
![{"base64":"  ","img":{"width":713,"height":199,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":11684,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/Integration-Guides/payments-integration-guide/payments-integration-payment-provider-framework-1_375.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/Integration-Guides/payments-integration-guide/payments-integration-payment-provider-framework-1_375.png)
6. Configure a [payment condition](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/how-to-configure-payment-conditions--tutorials%5F455) with your newly created connector and wait 10 minutes to appear on Checkout.
7. Make a purchase with the payment condition you configured with your connector.
8. After completing all transaction testing in the beta version of the connector, [release and deploy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-making-your-new-app-version-publicly-available%23step-6---deploying-the-app-stable-version) a stable version of your connector (e.g.: vtex.payment-provider-test@0.1.0). This stable version must be sent to the [homologation process](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/integrating-a-new-payment-provider-on-vtex%237-homologation-and-go-live).

## Making your connector available to process sales

> To process sales with your connector on all VTEX accounts, make sure to send the `billingOptions` field indicated as `free` in the manifest. If you want to restrict the use of the connector to only a few specific accounts, the `billingOptions` field must also be sent as `free`, but the payments team must be notified via a [support ticket](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/opening-tickets-to-vtex-support--16yOEqpO32UQYygSmMSSAM) to enable the connector only for the desired accounts. More information about this field can be found in the [Billing Options article](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-billing-options).

The publication process is made via the [app store](https://read.calvincode.net/reader?url=https://apps.vtex.com/). More info on how to do that can be found in the [Submitting your app to the VTEX App Store article](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-submitting-your-app-in-the-vtex-app-store).

After that, you need to [open a ticket to the VTEX support team](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/opening-tickets-to-vtex-support--16yOEqpO32UQYygSmMSSAM?locale=en) informing them that the integration was completed. However, before opening the ticket, make sure you have the following information:

* **Connector App Name**: Name of the PPF connector app. Use the following format: `"vendor.appname"`. For example: `partnername.connector-partnername`. These can be found in the `manifest.json` file.
* **Partner contact**: partner email address in case we need to communicate changes and new features of our protocol.
* **Production Service Provider Endpoint**: the base path that will be used for API calls to the provider, e.g. `https://vtex.pagseguro.com`. It has to respond to the route `{{serviceUrl}}/manifest` . This endpoint must be publicly available.
* **Allowed Accounts**: describe which VTEX accounts from this provider will be available (all accounts or specific accounts).
* **New Payment methods**: inform if this connector supports a payment method that is not yet available in the VTEX Admin.
* **New Payment method purchase flow**: if a "New Payment method" is supported, inform whether it works with Redirect or Payment App. For more information, access the [Purchase Flows article](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-purchase-flows).

The SLA required for the payment team to carry out homologation is 30 days.

After the homologation step is complete, your app needs to be installed in the account that wants to use it. Then, a new affiliation will be available to configure it.

## Updating and testing new configurations for an already published connector

To change and test new settings in an already published connector, you must:

1. Apply the new settings to the last created beta version of your connector.
2. Follow the same procedures described in the [Placing an order with your new connector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework%23placing-an-order-with-your-new-connector) section to verify that the beta version of your connector is working correctly after applying the new settings.
3. Create and submit a new stable version of your connector (containing the same modifications as the beta version) to the homologation process. E.g.: vtex.payment-provider-test@0.1.1.
4. Publish it as indicated in the [Making your connector available to process sales](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework%23making-your-connector-available-to-process-sales) section.

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F87548049%3Fv%3D4%26w=64%26q=75)](https://github.com/ricardoaerobr)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F7108339%3Fv%3D4%26w=64%26q=75)](https://github.com/brunoamui)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/Integration-Guides/payments-integration-guide/payments-integration-payment-provider-framework.md)

[Implementing a Payment Provider« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework//docs/guides/payments-integration-implementing-a-payment-provider)[Purchase FlowsNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework//docs/guides/payments-integration-purchase-flows)

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F87548049%3Fv%3D4%26w=64%26q=75)](https://github.com/ricardoaerobr)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F7108339%3Fv%3D4%26w=64%26q=75)](https://github.com/brunoamui)

ON THIS PAGE

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23getting-started)

[Cloning base repository](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23cloning-base-repository)[Updating your project](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23updating-your-project)

[Next steps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23next-steps)

[Payment Provider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23payment-provider)

[Payment Provider builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23payment-provider-builder)[Overriding the Manifest route](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23overriding-the-manifest-route)[Available Configurable Options](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23available-configurable-options)[Request a retry from Payment Gateway](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23request-a-retry-from-payment-gateway)[Payment Provider Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23payment-provider-service)[Using Secure Proxy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23using-secure-proxy)

[Placing an order with your new connector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23placing-an-order-with-your-new-connector)

[Making your connector available to process sales](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23making-your-connector-available-to-process-sales)

[Updating and testing new configurations for an already published connector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23updating-and-testing-new-configurations-for-an-already-published-connector)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/Integration-Guides/payments-integration-guide/payments-integration-payment-provider-framework.md)

Copy page

On this page

ON THIS PAGE

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23getting-started)

[Cloning base repository](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23cloning-base-repository)[Updating your project](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23updating-your-project)

[Next steps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23next-steps)

[Payment Provider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23payment-provider)

[Payment Provider builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23payment-provider-builder)[Overriding the Manifest route](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23overriding-the-manifest-route)[Available Configurable Options](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23available-configurable-options)[Request a retry from Payment Gateway](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23request-a-retry-from-payment-gateway)[Payment Provider Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23payment-provider-service)[Using Secure Proxy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23using-secure-proxy)

[Placing an order with your new connector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23placing-an-order-with-your-new-connector)

[Making your connector available to process sales](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23making-your-connector-available-to-process-sales)

[Updating and testing new configurations for an already published connector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework/docs/guides/payments-integration-payment-provider-framework%23updating-and-testing-new-configurations-for-an-already-published-connector)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] How do I use the VTEX product summary productsummaryattachmentlist app? Provide documentation and configuration details.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/updates/release-notes)

VTEX IO Apps

[Basic components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/basic-components)

[Add To Cart Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.add-to-cart-button)

[Autocomplete](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/Autocomplete)

[Banner](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/banner)

[Breadcrumb](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.breadcrumb)

[Footer](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.store-footer)

[Google One-Tap Login](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/google-one-tap-login)

[Header](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.store-header)

[Locale Switcher](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.locale-switcher)

[Login](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.login)

[Menu](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.menu)

[Minicart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.minicart)

[Order Placed](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.order-placed)

[Product Customizer](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-customizer)

[Product Highlights](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-highlights)

[Product Identifier](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-identifier)

[Product List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-list)

[Product Price](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-price)

[Product Quantity](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-quantity)

[Product Specifications](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-specifications)

[Product Summary](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary)

[Product Summary Attachment List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryattachmentlist)

[Product Summary Buy Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummarybuybutton)

[Product Summary Description](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummarydescription)

[Product Summary Image](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryimage)

[Product Summary List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummarylist)

[Product Summary Name](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryname)

[Product Summary Shelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryshelf)

[Product Summary SKU Selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryskuselector)

[Product Summary SKU Name](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryskuname)

[Rich Text](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.rich-text)

[Search](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search)

[Suggestions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/suggestions)

[DidYouMean](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/didyoumean)

[Search Result](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search-result)

[Store Image](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.store-image)

---

[Store Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/store-components)

---

[Advanced components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/advanced-components)

---

[B2B components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/b2b-components)

---

[B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.b2b-suite)

---

[Functional Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/functional-apps)

---

[Layout Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/layout-apps)

---

[Pixel Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/pixel-apps)

---

[My Account - StoreV2 version](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.my-account)

---

[VTEX IO deprecated apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/vtex-io-deprecated-apps)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/updates/release-notes)

VTEX IO Apps

[Basic components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/basic-components)

[Add To Cart Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.add-to-cart-button)

[Autocomplete](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/Autocomplete)

[Banner](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/banner)

[Breadcrumb](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.breadcrumb)

[Footer](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.store-footer)

[Google One-Tap Login](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/google-one-tap-login)

[Header](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.store-header)

[Locale Switcher](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.locale-switcher)

[Login](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.login)

[Menu](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.menu)

[Minicart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.minicart)

[Order Placed](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.order-placed)

[Product Customizer](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-customizer)

[Product Highlights](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-highlights)

[Product Identifier](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-identifier)

[Product List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-list)

[Product Price](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-price)

[Product Quantity](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-quantity)

[Product Specifications](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-specifications)

[Product Summary](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary)

[Product Summary Attachment List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryattachmentlist)

[Product Summary Buy Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummarybuybutton)

[Product Summary Description](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummarydescription)

[Product Summary Image](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryimage)

[Product Summary List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummarylist)

[Product Summary Name](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryname)

[Product Summary Shelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryshelf)

[Product Summary SKU Selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryskuselector)

[Product Summary SKU Name](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryskuname)

[Rich Text](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.rich-text)

[Search](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search)

[Suggestions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/suggestions)

[DidYouMean](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search/didyoumean)

[Search Result](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.search-result)

[Store Image](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.store-image)

---

[Store Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/store-components)

---

[Advanced components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/advanced-components)

---

[B2B components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/b2b-components)

---

[B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.b2b-suite)

---

[Functional Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/functional-apps)

---

[Layout Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/layout-apps)

---

[Pixel Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/pixel-apps)

---

[My Account - StoreV2 version](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.my-account)

---

[VTEX IO deprecated apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/vtex-io-deprecated-apps)

---

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/vtex-io-apps)

[Basic components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/guides/basic-components)

Product Summary Attachment List

[vtex.product-summary](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary)

Version: 2.91.0

Latest version: 2.91.0

Product Summary Attachment is the block exported by the [Product Summary app](https://read.calvincode.net/reader?url=https://developers.vtex.com/vtex-developer-docs/docs/vtex-product-summary) responsible for rendering the [attachment](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/o-que-e-um-anexo--aGICk0RVbqKg6GYmQcWUm) options available for a product.

![{"base64":"  ","img":{"width":1164,"height":751,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":722236,"url":"https://user-images.githubusercontent.com/67270558/156370029-833f68ce-a270-4e01-ae20-5d63061f0a03.png"}}](https://read.calvincode.net/reader?url=https://user-images.githubusercontent.com/67270558/156370029-833f68ce-a270-4e01-ae20-5d63061f0a03.png)

## Configuration

1. Import the `vtex.product-summary` app to your theme's dependencies in the `manifest.json`:

`1

 "dependencies": {

2

 "vtex.product-summary": "2.x"

3

 }

`

1. Add the `product-summary-attachment-list` block to a store template of your choice as a child of the `product-summary.shelf` block. For example:

`1

 "product-summary.shelf": {

2

 "children": [

3

 "product-summary-image",

4

 "product-summary-name",

5

 "product-summary-sku-name",

6

+ "product-summary-attachment-list",

7

 "product-summary-space",

8

 "product-summary-column#1"

9

 ]

10

 },

`

After adding the `product-summary-attachment-list` block to your store theme, use the VTEX Admin to add attachments to your products to display the component in your store correctly. For more information, please refer to [Adding an attachment](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/cadastrar-um-anexo--7zHMUpuoQE4cAskqEUWScU).

## Customization

To apply CSS customizations in this and other blocks, follow the [Using CSS Handles for store customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/vtex-developer-docs/docs/vtex-io-documentation-using-css-handles-for-store-customization) guide.

| CSS Handles               |
| ------------------------- |
| attachmentListContainer   |
| attachmentItemContainer   |
| attachmentItem            |
| attachmentItemProductText |

[Product Summary« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary)[Product Summary Buy ButtonNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummarybuybutton)

See also

[Vtex.product SummaryVTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary)[VTEX App StoreVTEX IO Apps](https://read.calvincode.net/reader?url=https://apps.vtex.com/)

ON THIS PAGE

[Configuration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryattachmentlist%23configuration)

[Customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.product-summary/productsummaryattachmentlist/docs/apps/vtex.product-summary/productsummaryattachmentlist%23customization)

Was this helpful?

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)