Widget Javascript API

IMPORTANT: This article applies to our old Widget product, which will be phased out during 2020 in favor of our new and improved widget tool Onsite Campaigns. Read more, and learn about the Onsite Campaign Product here.

Open Widget from a Button

JavaScript method: mtr_conversion.OpenWidgetById(widgetId)

"widgetId" is found in Triggerbee while editing your Widget (parameter called bannerId in the URL)

Example:

mtr_conversion.OpenWidgetById(1426948364)

<a href="javascript:void(0)" 
onclick="mtr_conversion.OpenWidgetById(1426948364)">Open Widget (click me!)</a><br>
	

Open Widget (click me!)

Listening to Events

NOTE: If you choose not to use our templates and instead code the banners yourself there are a few events to which you can subscribe. This will not work in Internet Explorer 8 or earlier versions.

Add your own code to the following examples:

onWidgetOpened

The event is fired when a widget is opened. The event argument contains the following parameters:

• widget_id - ID of the widget in Triggerbee
• widget_title - Title of the widget in Triggerbee

if(document.addEventListener){ 
    document.addEventListener("onWidgetOpened", function(event) {  
       // add your own code 
       console.log(event.widget_id);
    }); 
}

onWidgetClosed

The event is fired when a widget is closed. The event argument contains the following parameters:

• widget_id - ID of the widget in Triggerbee
• widget_title - Title of the widget in Triggerbee

if(document.addEventListener){
      document.addEventListener("onWidgetClosed", function(event) { 
      // add your own code
      console.log(event.widget_id); 
   }); 
}

onWidgetMinimized

The event is fired when a widget is minimized. The event argument contains the following parameters:

• widget_id - ID of the widget in Triggerbee
• widget_title - Title of the widget in Triggerbee

if(document.addEventListener){
   document.addEventListener("onWidgetMinimized", function(event) { 
      // add your own code
      console.log(event.widget_id);
   ;})
}

onWidgetMaximized

The event is fired when a widget is maximized. The event argument contains the following parameters:

• widget_id - ID of the widget in Triggerbee
• widget_title - Title of the widget in Triggerbee

if(document.addEventListener){
   document.addEventListener("onWidgetMaximized", function(event) {
      // add your own code
      console.log(event.widget_id); 
   ;})
}

onWidgetClickThrough

The event is fired when a visitor clicks in a widget that is using Click-through. The event argument contains the following parameters:

• widget_id - ID of the widget in Triggerbee
• widget_title - Title of the widget in Triggerbee

if(document.addEventListener){      
  document.addEventListener("onWidgetClickThrough", function(event) {          
    // add your own code       
    console.log(event.widget_id);    
   });  
}

onWidgetBeforeFormSubmit

The event is fired before the form in your widget is submitted (when the form input is valid according to eventual validation).
In the callback parameter, there are a property "details" that contains information about the converted visitor's input values (see example below).
Some fields are going to be null since values are based on the fields in your widget. Example: If your widget has an input for  email, you would get a value in console.log(event.details.email)

The event argument contains the following parameters:

• widget_id (number) - ID of the widget in Triggerbee
• widget_title (string)- Title of the widget in Triggerbee
• details (object) - Data from the form that is submitted. Available properties are: name, email, organization, telephone, goal

document.addEventListener("onWidgetBeforeFormSubmit", function(event) { 
    // add your own code
    console.log(event.details);
    /* Example output:
    event.details = {
       name:'Erlich Bachman',
       email:'[email protected]',
       organization:'Piedpiper',
       telephone:'0123456789',
       goal:'Order' // Name of the goal for this conversion
  } 
  */
 });

External Analytics

If you are using any external analytics tools (such as Google Analytics), you can log events from your Widgets: