Documentation
Feedback
Guides

Gift List
Product Modal

The modal-select-product block displays a modal with detailed information (such as size and color) about the product the costumer wants to add to the lists they own.

{"base64":"  ","img":{"width":905,"height":533,"type":"gif","mime":"image/gif","wUnits":"px","hUnits":"px","length":8364893,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/vtex-list-productmodal-0.gif"}}

Configuration

  1. Import the vtex.list app to your theme's peer dependencies in the manifest.json file as in the following example:
  "peerDependencies": {
    "vtex.list": "3.x"
  }
  1. Add the modal-select-product block to other theme block, such as the responsive-layout.desktop. For example:
  "responsive-layout.desktop": {
    "children": [
+     "modal-select-product",
    ]
  }

Customization

Prop NameTypeDescriptionDefault Value
nameButtonstringChanges the name of the button that opens the modal"Button name"
Contributors
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
Was this helpful?
Yes
No
Suggest edits (Github)
Contributors
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
On this page