Customizing Web Widget events tracking to third-party analytics services

The Web Widget (Classic) automatically reports alluser interactions in the widgetto Google Analytics if the tracker is on the same web page. However, theon userEventAPI command can be used to customize the integration of the widget with Google Analytics. It can also report widget user events to other third-party analytics services such as Segment.io and Adobe Analytics. This article provides a few examples on implementing this command.

This article contains the following sections:

Related information:

Filtering widget events for Google Analytics

Theon userEventAPI command can be added on your web page to filter events reported to Google Analytics.

In the following example:

  • TheanalyticsAPI setting is added first and set to false to disable user events automatically being tracked in Google Analytics
  • In theon userEventcommand, the event actions “Chat Served by Operator” and “Chat Comment Submitted” are only tracked in Google Analytics
  • The GAsendcommand sends the event payload
             
<scripttype="text/javascript">window.zESettings={analytics:false};varEVENTS_TO_SEND=['Chat Served by Operator','Chat Comment Submitted'];zE('webWidget:on','userEvent',function(event){if(event.action===event.action.indexOf(EVENTS_TO_SEND)<0)return;varpayload={hitType:'event',eventCategory:event.category,eventAction:event.action,eventLabel:event.properties};window.ga('send',payload)})script>

To understand the command syntax for sending events, refer to theGoogle Analytics documentation.

Configuring widget events reporting with multiple Google Analytics trackers

There are instances wheremultiple trackersare operating on a web page to send data to different properties in Google Analytics. For example, a default unnamed tracker and two other trackers named “Tracker1” and “Tracker2”:

             
ga('create',“UA-XXXXX-X”,'auto');ga('create','UA-XXXXX-Y','auto','Tracker1');ga('create','UA-XXXXX-Z','auto','Tracker2');

By default, the widget sends event data to all trackers on the page. To send events to a named tracker, modify your web page with theanalyticsAPI setting, theon userEventcommand, and the GAsendcommand with the tracker name.

For example:

             
<scripttype="text/javascript">window.zESettings={analytics:false};zE('webWidget:on','userEvent',function(_ref){varcategory=_ref.category;varaction=_ref.action;varproperties=_ref.properties;varpayload={hitType:'event',eventCategory:event.category,eventAction:event.action,eventLabel:event.properties};ga('Tracker1.send',payload);});script>

In the example:

  • TheanalyticsAPI setting is set to “false” to prevent all widget events being automatically sent to Google Analytics
  • TheonUserEventcommand specifies the events to be sent
  • The Google Analyticssendcommand specifies events to be sent to the GA tracker named “Tracker1”