Documentation
Feedback
Guides
VTEX IO Apps

VTEX IO Apps
Pixel Apps
Elfsight
Official extension
Version: 1.0.0
Latest version: 1.0.0

{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAIAAAB2XpiaAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAFUlEQVR4nGPg4+Mz1Nfjl5T7f2c+AAzxA3lptuDWAAAAAElFTkSuQmCC","img":{"src":"https://img.shields.io/badge/all_contributors-0-orange.svg?style=flat-square","width":110,"height":20,"type":"svg"}}

Elfsight first party integration app. The solution provides widgets that help website owners to increase sales, engage visitors, collect leads and more.

{"base64":"  ","img":{"width":1266,"height":581,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":1790558,"url":"https://user-images.githubusercontent.com/284515/87573824-dbee0700-c6a3-11ea-9ca2-0f03809b785b.png"}}

Configuration

  1. Adding the app as a theme dependency in the manifest.json file;

_10
"dependencies": {
_10
"vtex.elfsight": "1.x"
_10
}

  1. Add the block elfsight, responsible for rendering your Elfsight widget, to your theme blocks.json file. Notice: the block can be added to any page template you want.
  2. Declare in it the prop appId whose value must be the app ID of the widget provided by Elfsight. For example:

_11
"footer-layout.desktop": {
_11
"children": [
_11
+ "elfsight#foobar"
_11
]
_11
},
_11
_11
+ "elfsight#foobar": {
_11
+ "props": {
_11
+ "appId": "4a13d81d-20f3-4661-b472-9de777efe3ed"
_11
+ }
_11
+ }

elfsight props

Prop nameTypeDescriptionDefault value
appIdstringThe app ID of the widget provided by Elfsight. The format should be as follows: XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX.undefined

You should get the app ID from the Elfsight admin:

{"base64":"  ","img":{"width":646,"height":456,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":40160,"url":"https://user-images.githubusercontent.com/284515/87574775-3d62a580-c6a5-11ea-8278-3090254b16af.png"}}

See also
VTEX App Store
VTEX IO Apps