Product Labels / Tags

Store Development
1

I’ve seen on some VTEX-based sites product tags or labels overlaid on product images such as “New” or “On Sale” or “Clearance”. Is that a feature of the out-of-the-box Store Theme? Is it documented somewhere as to how to allow Business Users to set the tags/labels so that Developers aren’t always needed every time there are new/changed labels?

2

Hi @james.fong, how are you?

You can do it by using collections with vtex.product-highlights@2.x:product-highlights.

To insert this in the code:

“vtex.product-highlights@2.x:product-highlights#collection”: {
“props”: {
“type”: “collection”
},
“children”: [“product-highlight-wrapper”]
},
“product-highlight-wrapper”: {
“props”: {
“blockClass”: “collection”
},
“children”: [“product-highlight-text”]
},

       "product-highlight-text": {
         "props": {
           "message": "{highlightName}"
         }
       }

You can use it for collections as well as promotions and teasers.

This way, Business Users will only need to insert the products into the collections they want.

If necessary, you can use the vtex documentation: Product Highlights<!-- --> by <!-- -->vtex.

Hope this can be useful.