How to use the Banner SDK

Hide widget

Hide the widget using the SDK by calling hide()

window.addEventListener('Banner:Loaded', () => {
    Answerly.Banner.hide();
})

Show widget

Show the widget again by calling show()

window.addEventListener('Banner:Loaded', () => {
    Answerly.Banner.show();
});

Destroy widget

Destroy the widget entirely from the webpage by calling destroy(). This removes the SDK as well.

window.addEventListener('Banner:Loaded', () => {
    Answerly.Banner.destroy();
});

Run code when the widget is closed

You can assign a function to onHide and the banner widget will run your function when the widget is closed by the visitor or SDK.

window.addEventListener('Banner:Loaded', () => {
    Answerly.Banner.onHide = () => {
        console.log(' you have closed the widget ')
    };
});

Run code when a link is clicked

You can assign a function to onLinkClick and the banner widget will run your function when the visitor clicks a link, it will also pass you a link object, more info below:

window.addEventListener('Banner:Loaded', () => {
    Answerly.Banner.onLinkClick = (link) => {
        console.log(' you have clicked ' + link.url);
    };
});

The link variable passed to your function is an object with information about which link has been clicked.  It has a simple structure if only 3 key/value pairs: 

url (string) - The full URL of the link

text (string) - The text of the link

target (Element) - The link element itself

Widget's HTML elements

You can access the banner widget's html elements inside the Answerly.Banner.elements object. 

This object has the following key/value pairs: 

iframe (Element) - The iframe wrapper of the widget

html (Element) - The main html element, inside the iframe

banner (Element) - The main widget wrapper

content (Element) - Widget text content wrapper

close (Element) - The close icon 

authorImg (Element) - The author img tag

links (Array<Element>) - Array of all links included in your widget