Product Summary SKU Selector

The product-summary-sku-selector is a VTEX block that's tasked with rendering the SKU Selector component in a Product Summary component, such as the Shelf or the Search Results Page.



  1. Follow the Product Summary app's configuration instruction.
  2. Add the product-summary-sku-selector to the Product Summary's desired block. In the following example, we'll use a Shelf:
"product-summary.shelf": {
   "children": [
  1. Below, declare the product-summary-sku-selector block. The props that it uses are the same that are available for the SKU Selector. For example:
     "product-summary-sku-selector": {
        "showVariationsLabels": ["false"]
    ⚠️ This block can only be configured through the source code. You're not yet able to edit using the Site Editor.


CSS HandlesDescriptionComponent Source
SKUSelectorContainerSKU Selector main containerindex