<!-- Using HTML to modify 'pos' attribute --><beacon-app key="<BEACON_KEY>" pos="right"></beacon-app>
// Using JS to modify 'pos' attributevar beacon = document.getElementsByTagName('beacon-app');beacon.pos = 'right';
It is used only when beacon window is generated. Once beacon window is loaded, this attribute has no effect.
Key is a unique string that is used to identify your beacon window in the database. Changing this attribute only has affect before the page is loaded, as data from the server is received only once before showing the beacon window.
This attribute refers to the position of the beacon window on your web page. As of now, the SDK supports only two positions which can be set as follows.
Bottom Right -
beacon.pos = 'right';
Bottom Left - In all other cases.
Stringof a valid hex color code
This attribute refers to the main theme color used to style the beacon window. It can be changed using the SDK and would override the primaryColor that was set on the dashboard.
Updating this attribute, also changes the text color so that text is readable on different colored backgrounds. Usage of this attribute is given below.
<beacon-app key="<BEACON_KEY>" primary-color="#ff0000"></beacon-app>
var beacon = document.getElementsByTagName('beacon-app');beacon.primaryColor = '#ff0000';
This attribute is the message that shows up when the user has just visited the page and not yet opened the beacon window. It must be used wisely to get visitor's attention to open the beacon window. Read More Usage of this attribute is given below.
<beacon-app key="<BEACON_KEY>" call-message="Hello World"></beacon-app>
var beacon = document.getElementsByTagName('beacon-app');beacon.callMessage = 'Hello World';