Hello! We have an HTML5 output, for an EN and a FR project. We want to be able to collect analytics, using Google Analytics, Trialfire, and Heap. However, we are having trouble getting the code(s) in all the right places.
Right now, we have Google analytics code in our masterpages (we have 3 different types of masterpages, for our home page, our landing pages, and our topic pages) and our script.js file.
It looks like this in our master pages:
<head>
<script> (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) })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga'); ga('create', 'UA-123456789-1', 'auto'); ga('send', 'pageview');</script>
</head>
It looks like this in our scripts.js file:
// Google Analytics
(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)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
//ga('create', 'UA-XXXXX-Y', 'auto');
//ga('send', 'pageview');
Which seems to be working correctly. The trouble begins when we start to layer in TrialFire and Heap.
When we add Trialfire, I get an error in IE that our content has become 'unsecure' - our TrialFire code looks like this: <script src="//cdn.trialfire.com/tf.js"></script> <script>Trialfire.init('code');</script> and I added the same to the scripts.js file.
When we try to put Heap in, I can't even put in the script, into the master pages, because it says there is a syntax error. The sample Heap script is:
<script type="text/javascript">
window.heap=window.heap||[],heap.load=function(e,t){window.heap.appid=e,window.heap.config=t=t||{};var r=t.forceSSL||"https:"===document.location.protocol,a=document.createElement("script");a.type="text/javascript",a.async=!0,a.src=(r?"https:":"http:")+"//cdn.heapanalytics.com/js/heap-"+e+".js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(a,n);for(var o=function(e){return function(){heap.push([e].concat(Array.prototype.slice.call(arguments,0)))}},p=["addEventProperties","addUserProperties","clearEventProperties","identify","resetIdentity","removeEventProperty","setEventProperties","track","unsetEventProperty"],c=0;c<p.length;c++)heap[p[c]]=o(p[c])};
heap.load("YOUR_APP_ID");
</script>
Has anyone had any luck trying to use any/all 3 of these setups for analytic collecting and can point me in various/helpful directions?
Thank you!
Adriana
Using Heap, Google Analytics, and Trialfire in HTML5 output
Re: Using Heap, Google Analytics, and Trialfire in HTML5 out
GA
The code you posted is the old format of the 'ga' code that Google chanegd in 2017. I'd recommend updating it to the current 'gtag' code, because the old 'ga' code may stop working one day.
See: viewtopic.php?f=13&p=136831#p136808
Trialflare
Think that's purely a Trialflare issue rather than anything to do with Flare - maybe ask their support/forums.
Heap
You're getting syntax errors because the code isn't formatted correctly for use in HTML. It contains at least one "<" character.
If you want to put JS code in a Flare topic/master page, use the XML Editor (rather than paste directly in Text Editor), and select Insert > Script. That will reformat the script for you.
Anyway, I'd suggest putting the code in a separate JS file instead (minus script tags), and have a link to that JS file from the master page. It saves having multiple copies of the same code everywhere.
The code you posted is the old format of the 'ga' code that Google chanegd in 2017. I'd recommend updating it to the current 'gtag' code, because the old 'ga' code may stop working one day.
See: viewtopic.php?f=13&p=136831#p136808
Trialflare
Think that's purely a Trialflare issue rather than anything to do with Flare - maybe ask their support/forums.
Heap
You're getting syntax errors because the code isn't formatted correctly for use in HTML. It contains at least one "<" character.
If you want to put JS code in a Flare topic/master page, use the XML Editor (rather than paste directly in Text Editor), and select Insert > Script. That will reformat the script for you.
Anyway, I'd suggest putting the code in a separate JS file instead (minus script tags), and have a link to that JS file from the master page. It saves having multiple copies of the same code everywhere.
Re: Using Heap, Google Analytics, and Trialfire in HTML5 out
Thank you! Do we put the same code in both our scripts.js file and the master pages (for the Google analytics code):
So I now have this in my scripts.js file:
// Google Analytics
<!-- Global site tag(gtag.js) - Google Analytics -->
<script async src = "https://www.googletagmanager.com/gtag/j ... "></script>
<script >
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXX-X');
</script>
//ga('create', 'UA-XXXXX-Y', 'auto');
//ga('send', 'pageview');
And I have this in the head of all my master pages:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async="async" src="https://www.googletagmanager.com/gtag/j ... "></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXX-X');
</script>
TIA!
Adriana
So I now have this in my scripts.js file:
// Google Analytics
<!-- Global site tag(gtag.js) - Google Analytics -->
<script async src = "https://www.googletagmanager.com/gtag/j ... "></script>
<script >
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXX-X');
</script>
//ga('create', 'UA-XXXXX-Y', 'auto');
//ga('send', 'pageview');
And I have this in the head of all my master pages:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async="async" src="https://www.googletagmanager.com/gtag/j ... "></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXX-X');
</script>
TIA!
Adriana
Re: Using Heap, Google Analytics, and Trialfire in HTML5 out
Nope, that's not what I suggested.
I only suggested to put the Heap code in a separate JS file.
The Google code you have in your master page looks ok. Remove it from your JS file.
I only suggested to put the Heap code in a separate JS file.
The Google code you have in your master page looks ok. Remove it from your JS file.
Re: Using Heap, Google Analytics, and Trialfire in HTML5 out
Ah! Ok, thank you. I made those changes and both Heap and Google and now working. Awesome! Thanks so much!
The only one left we have to figure out is our TrialFire script: <script src="https://cdn.trialfire.com/tf.js"></script> <script>Trialfire.init('TRIALFIRECODE');</script>. Although it is going into Flare no problem, it doesnt seem to be tracking. We have put the script into all 3 of our master pages. Has anyone ever used Trialfire for analytics tracking, with Madcap?
Adriana
The only one left we have to figure out is our TrialFire script: <script src="https://cdn.trialfire.com/tf.js"></script> <script>Trialfire.init('TRIALFIRECODE');</script>. Although it is going into Flare no problem, it doesnt seem to be tracking. We have put the script into all 3 of our master pages. Has anyone ever used Trialfire for analytics tracking, with Madcap?
Adriana
Re: Using Heap, Google Analytics, and Trialfire in HTML5 out
For what it's worth, here is a screenshot of what is happening when the website is rendering... The tf.js script is included but the Traiflire.init is above it and wrapped in a CDATA. Any thoughts or suggestions are welcome!
Adriana
You do not have the required permissions to view the files attached to this post.
Re: Using Heap, Google Analytics, and Trialfire in HTML5 out
Rather than put the trailflare init script inside the head, put it inside the body before the closing </body> tag.
Re: Using Heap, Google Analytics, and Trialfire in HTML5 out
Thanks Dave. We actually found another work-around, late last night - a script that looks like this is working as well:
<script>
var s = document.createElement('script');
s.src = 'https://cdn.trialfire.com/tf.js';
s.onload = function () { Trialfire.init('TRIALFIRECODE'); };
document.head.appendChild(s);
</script>
Hopefully all this can help someone else at some point! Thanks to everyone fro their input and feedback.
Adriana
<script>
var s = document.createElement('script');
s.src = 'https://cdn.trialfire.com/tf.js';
s.onload = function () { Trialfire.init('TRIALFIRECODE'); };
document.head.appendChild(s);
</script>
Hopefully all this can help someone else at some point! Thanks to everyone fro their input and feedback.
Adriana