Documentation
Feedback
Guides
VTEX IO Apps

VTEX IO Apps
Basic components
Product Summary Attachment List
vtex.product-summary
Version: 2.89.0
Latest version: 2.89.0

Product Summary Attachment is the block exported by the Product Summary app responsible for rendering the attachment 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"}}

Configuration

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

_10
"dependencies": {
_10
"vtex.product-summary": "2.x"
_10
}

  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:

_10
"product-summary.shelf": {
_10
"children": [
_10
"product-summary-image",
_10
"product-summary-name",
_10
"product-summary-sku-name",
_10
+ "product-summary-attachment-list",
_10
"product-summary-space",
_10
"product-summary-column#1"
_10
]
_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.

Customization

To apply CSS customizations in this and other blocks, follow the Using CSS Handles for store customization guide.

CSS Handles
attachmentListContainer
attachmentItemContainer
attachmentItem
attachmentItemProductText
See also
Vtex.product Summary
VTEX IO Apps
VTEX App Store
VTEX IO Apps