Introducing WebEngage Javascript API and new version of the integration code

We are pleased to announce the introduction a new version of WebEngage integration code (Version 3.0). Not only is it better and faster but it is also a first step towards our commitment to open up the platform so that you can run WebEngage in a much more controlled manner using our API’s.

So, here’s how the new WebEngage integration code will look like –
<script id="_webengage_script_tag" type="text/javascript">// <![CDATA[ window.webengageWidgetInit = window.webengageWidgetInit || function(){ webengage.init({ licenseCode:"82617417" }).onReady(function(){ webengage.render(); }); }; (function(d){ var _we = d.createElement('script'); _we.type = 'text/javascript'; _we.async = true; _we.src = (d.location.protocol == 'https:' ? "//" : "//") + "/js/widget/webengage-min-v-3.0.js"; var _sNode = d.getElementById('_webengage_script_tag'); _sNode.parentNode.insertBefore(_we, _sNode); })(document); // ]]></script>
This change allows you to do a whole bunch of things. E.g. now, you can have multiple links to the feedback tab and each time you can choose to open the feedback form with a different category. You can also choose to have your own trigger points for invoking a particular survey depending on some use-case scenarios. Check out these cool demos:
Clicking this button opens the feedback tab with the category “Sales/pricing related query” pre-selected. The feedback form also displays custom fields linked to this category, by default (notice the “what kind of help do you need” dropdown in the form). Clicking this button opens the feedback tab with “Jobs and hiring” as the category. And it also displays the corresponding custom field by default (“upload your resume”, in this case). Oh, did you notice that the category field is not being shown at all? Thanks to the API call below! Clicking this button triggers a particular survey pre-created in your WebEngage dashboard. You can override a lot of default behaviors of WebEngage via the API – e.g display a survey even if its taken, ignore the targeting rules etc, apply time delays (or ignore them) etc.
Underneath is the JS API code that makes all of the above demos happen:
<script type="text/javascript">// <![CDATA[ /** * define a function called webengageWidgetInit in the current window. * if you define one, we'll use yours, otherwise we switch back to the * default one that we ship along with our integration code. */ window.webengageWidgetInit = function(){ webengage.init({ licenseCode:"82617417" //this is how we identify your site }).onReady(function(){ //render the feedback (tab) and survey (if any) by default webengage.render(); //Demo 1: bind the click event of sales-related-query button $("button#sales-related-query").click(function(){ //render the feedback tab{ defaultFeedbackCategory:"Sales/pricing related query", showAllFeedbackCategories:true, showFeedbackForm:true //open the tab }); }); //Demo 2: bind the click event of apply-for-job button $("button#apply-for-job").click(function(){{ defaultFeedbackCategory:"Jobs and hiring", showAllFeedbackCategories:false, //don't show the category drop-down showFeedbackForm:true }); }); //Demo 3: bind the click event of take-a-survey button $("button#take-survey").click(function(){ //call the survey renderer webengage.survey.render({ //specify the survey to invoke (get ID from your dashboard) surveyId:"7djl619", //don't worry about targeting-rules for the survey //more on what is targeting and why should you use it - // skipRuleExecution:true, //once a user has taken a survey or closed it on your site //we don't display the same survey to this visitor again. //now, you can choose to override this behavior showAllClosedAndTakenSurveys:true, //to keep the user experience intact on your site, WebEngage //let's you time-delay the survey. this works great in //auto mode. however, while using the API, you'd want the survey //to immediately pop upon some user action. "delay" is your friend :) delay:0 }); }); }); }; // ]]></script>

What’s next?

  1. We’ll release the API documentation and JS SDK officially next week. Until then, please free to play around and poke us if you have some crazy ideas on how do you want to make use of the JS API on your site.
  2. We’ll optionally let you pass user data along with each request made to the WebEngage API. Our ultimate goal is to pass this data to our reporting and analytics modules so that you get access to some amazing insights on user behavior.
  3. We’ll publish the anatomy of this API and our thought processes behind its design on our engineering blog for our hacker friends.
Note for existing customers:
We’ll continue to back support the older versions of integration code (Version 2.x.x and below). However, we highly recommend upgrading to the latest one. This code can be obtained from within your dashboard. We’ll send an official communication to all our customers once the API documentation is released next week.
New to WebEngage? Give us a go –

Stay tuned. We love you!

Comments are closed.