Track Hushly Events in Google Analytics - Integration

Overview

The purpose of this document is to guide you in setting up the Google Analytics Event Tracking for Hushly Runtime Events.

Note: If you are using Google Analytics 4, please refer to this document. 

Prerequisites

1. Google Analytics Code must be Installed on the Landing Page.

2. Google Tracker should be Instantiated.
   
   

Tracked Events

Following Hushly events can be tracked via Google Analytics

1. Content View.

2. Content Interaction.

3. Invalid Form Submit.

4. Valid Form Submit.

Configure Event Handlers to Track Hushly Events in Google Analytics

Configure Event Handlers at the System Level

1. Login to your Hushly Account.
   
   

2. From the Left Nav menu, under Setup, click Settings. In the Tracking Section, paste any one of the following codes in the Event Handlers field.
   
   Note: You could configure the Event Handlers using either gtag.js or analytics.js.
   
   Important: Event Handlers once configured at the System level will apply for all the Experiences and Hubs
   
   * gtag.js [The Global Site tag]:

   hushly('bind', 'content-view', function(options) {
       gtag('event', 'Content View', {
           'event_category': 'Hushly',
           'eventLabel': options.experienceName || options.streamName
       });
   });
   hushly('bind', 'content-interaction', function(options) {
       gtag('event', 'Content Interaction', {
           'event_category': 'Hushly',
           'eventLabel': options.experienceName || options.streamName
       });
   });
   hushly('bind', 'invalid-form-submit', function(formData) {
       gtag('event', 'Invalid Form Submit', {
           'event_category': 'Hushly',
           'eventLabel': formData.experienceName || formData.streamName
       });
   });
   hushly('bind', 'form-submit', function(formData) {
       gtag('event', 'Form Submit', {
           'event_category': 'Hushly',
           'eventLabel': formData.experienceName || formData.streamName
       });
   });

   
   * analytics.js [The Google Analytics tag]:

   hushly('bind', 'content-view', function(options) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Content View',
           'eventLabel': options.experienceName || options.streamName
       });
   });
   
   hushly('bind', 'content-interaction', function(options) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Content Interaction',
           'eventLabel': options.experienceName || options.streamName
       });
   });
   
   hushly('bind', 'invalid-form-submit', function(formData) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Invalid Form Submit',
           'eventLabel': formData.experienceName || formData.streamName
       });
   });
   
   hushly('bind', 'form-submit', function(formData) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Form Submit',
           'eventLabel': formData.experienceName || formData.streamName
       });
   });

   
   

Configure Event Handlers at Experience Level:

1. Navigate to Experiences, select an Experience, and go to Settings > Advanced Settings.
   
   

2. Paste any one of the below codes in the Event Handlers Field.
   
   Note: Make sure you replace the <experience-guid> with the actual guid to the Experience.
   
   

   * gtag.js [The Global Site tag]:

   hushly('bind', 'content-view', '<experience-guid>', function(options) {
       gtag('event', 'Content View', {
           'event_category': 'Hushly',
           'event_label': options.experienceName
       });
   });
   hushly('bind', 'content-interaction', '<experience-guid>', function(options) {
       gtag('event', 'Content Interaction', {
           'event_category': 'Hushly',
           'event_label': options.experienceName
       });
   });
   hushly('bind', 'invalid-form-submit', '<experience-guid>', function(formData) {
       gtag('event', 'Invalid Form Submit', {
           'event_category': 'Hushly',
           'event_label': formData.experienceName
       });
   });
   hushly('bind', 'form-submit', '<experience-guid>', function(formData) {
       gtag('event', 'Form Submit', {
           'event_category': 'Hushly',
           'event_label': formData.experienceName
       });
   });

   
   * analytics.js [The Google Analytics tag]:

   hushly('bind', 'content-view', function(options) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Content View',
           'eventLabel': options.experienceName
       });
   });
   
   hushly('bind', 'content-interaction', function(options) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Content Interaction',
           'eventLabel': options.experienceName
       });
   });
   
   hushly('bind', 'invalid-form-submit', function(formData) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Invalid Form Submit',
           'eventLabel': formData.experienceName
       });
   });
   
   hushly('bind', 'form-submit', function(formData) {
       var _hly_ga_cmd = 'send';
       var trackers = ga.getAll();
       if (trackers && trackers.length > 0) {
           _hly_ga_cmd = trackers[0].get('name') + '.send';
       }
       ga(_hly_ga_cmd, 'event', {
           'eventCategory': 'Hushly',
           'eventAction': 'Form Submit',
           'eventLabel': formData.experienceName
       });
   });

   
   

Configure Event Tracking at Hub Level:

You can also configure Event Tracking at a Hub Level.

1. For a V2 Hub, Navigate to Hubs, from the Hub menu, select Branding > Show Advanced Options.
   
   

2. Paste the below code in the Header section.
   
   Note: You can get the below code from your Google Analytics account. Go to Admin > Tracking Info > Tracking Code. In the below code replace <Tracking ID> with your Google Analytics Tracking ID.

   <!-- Global site tag (gtag.js) - Google Analytics -->
   <script async src="https://www.googletagmanager.com/gtag/js?id=<Tracking ID>"></script>
   <script>
     window.dataLayer = window.dataLayer || [];
     function gtag(){dataLayer.push(arguments);}
     gtag('js', new Date());
   
     gtag('config', '<Tracking ID>');
   </script>

3. For a V3 Hub, follow these steps:

• Navigate to Hubs.
• From the Hubs listing page, select the desired Hub.
• From the Hub menu, click Custom Code.
• On the Custom Code page, click the New Custom Code button.
• In the Code section, paste the code and click Save.

Important: When the user interacts with an item on the Stream, the event is tracked.

Track Content Download

Since the Content download happens on the Hushly website it is not possible to invoke the Google Analytics code directly. 

1. From the Left Nav menu, under Setup, click Field Management.
   
   

2. Create a Custom Field to Track Google Analytics Identifier, Set the default value as {{cookies._ga}}
   
   

3. Navigate to Setup > Settings, and scroll to Tracking Section:

   • Set the value for the Tracked Cookies field as _ga.
     
     

   • Paste the following code in the Download Tracking Code field.
     
     

     <script> 
     var gaCookie = '{{lead_c.google_analytics_identifier}}'.split(".");
     var tid = 'XX-111091507-1',
         cid = gaCookie[2] + "." + gaCookie[3];
     var pageUrl = '{{lead_c.sourceUrl}}',
         eventCategory = 'Hushly',
         eventAction = 'Content Download',
         eventLabel = '{{widget_c.name_c}}'; 
     var trackingImgUrl = "http://www.google-analytics.com/collect?v=1&tid=" + tid + "&cid=" + cid + "&t=event&dl=" + pageUrl + "&ec=" + eventCategory + "&ea=" + eventAction + "&el=" + eventLabel; 
     var img = new Image(); 
     img.src = trackingImgUrl; 
     </script>

     Note: Please change the value of the "tid" variable to your Google Analytics Account id.
     

     
     

Related Topics:

Google Analytics 4 Integration

Google Ads Integration Information & Setup

Google Tag Manager (GTM) Information and Setup