Skip to main content

Using Analytics in your app

One of the most effective ways to improve your app and learn more about your users is implementing solid analytics that provide you with usage statistics. Stats support your product decision making by providing real-world user usage data, including showing how users actually interact with each part of your product. Analytics also underline where users drop off and lose interest, what product abilities are completely ignored and much more.

We recommend using a web analytics service to collect app data, measure user engagement and improve monetization. Our preference is the industry standard Google Analytics.

Please take the time you need to implement any chosen analytics service thoroughly and test it to make sure it's working as intended.

Google Analytics: Basic Implementation​

note

The below information is regarding the implementation of Google Analytics' "analytics.js". The newer, more up-to-date implementation of "gtag.js" does not work in Overwolf apps at the moment. Keep this in mind when searching for implementation documentation elsewhere.

Update your manifest.json​

Open up the external connections necessary for communicating with the Google service:

{
"data":{  
   "externally_connectable":{  
      "matches":[  
         "https://*.google-analytics.com",
         "http://www.google-analytics.com"
      ]
   }
}

Create a Google Analytics account and generate a new property​

Select "Website" as your tracked object, enter your website name, website URL and select your preferred reporting time zone.

Create a new property

Create a new property

Create a new property

Create a new property

Update your pages​

Let's assume that you want to track events in your index page. In your /index.html, add a reference to the tracking script in a separate file:

<!DOCTYPE html>
<html>
<head>
  ...
  <script src="js/index.js"></script>
  ...
</head>
<body>
  ...
</body>
</html>

Update your tracking code​

Add the tracking JavaScript, for example at js/index.js, with the Universal Analytics code. Note the “https” at the start of the script address.

// Standard Google Universal Analytics code
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function()
   {
      (i[r].q=i[r].q||[]).push(arguments)
   },
   i[r].l=1*new Date();a=s.createElement(o),
   m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
   // Note: https protocol here
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-YY', 'auto');

// Removes failing protocol check. @see: http://stackoverflow.com/a/22152353/1958200
ga('set', 'checkProtocolTask', function(){}); 
ga('require', 'displayfeatures');
ga('send', 'pageview', '/index.html');

If that all went well, you should see page tracking appear in Google Analytics, like so:

process

process

process

process

More info​

Find more information on best practices and more guides for implementing google analytics here.