Adding Google Analytics Universal Tracking Code to HTML

Hi Everyone,

I've been able to successfully put Google Analytics code (universal) into the story.html5 file. However, I can't find instructions on how to put it into the story.html file. 

1) Could you help provide direction on how to put the code in story.html? 

2) Is it necessary to have it in story.html if it's already in story.html5?

Thank you!

26 Replies
Christie Pollick

Hi, Ryan -- Thanks for reaching out! While I will defer to your fellow community members for their advice and recommendations, I did want to pass along the following posts in case they may be of assistance to you:

Google Analytics in Story.html file

Getting Google Analytics from a Storyline Website

Tracking visit with Google Analytics

 

Hope that helps! :)

Tracy Livingston

I understand this thread is somewhat orphaned, but I'm hoping someone can help with pulling GA out of StoryLine. I can edit the HTML files with the GA and native code snippets, but nothing is registering within my StoryLine file itself.

I've tried what others have been successful in doing, but those threads are 6 years old and I'm curious if StoryLine no longer supports embedding javascript calls for Google Analytics. Here's what I've tried without success.  I'm getting a page count when the page loads so I know it's connecting with GA, but nothing within the storyline file is triggering the same events. 

An execute javascript from a timeline start trigger: ga('send', 'pageview', '/PAGENAME');

As an execute javascript from a button: ga('send', 'event', 'button', 'ButtonClick');

Ashley Terwilliger-Pollard

Hi Tracy,

This discussion is a bit older, so I'm not certain if folks are still subscribed here either.

With Storyline 3 & 360, we did make a lot of changes to the player and our HTML5 output. Those changes caused some of these custom Javascript triggers to not work as before, so if you're using one of these versions that could explain what you're running into. 

I'm not well versed in Javascript, but if you wanted to share a bit more about your setup (version of Storyline, full code snippets, hosting/viewing location, etc.) I know we have plenty of Javascript experts here in the community! 

Tracy Livingston

Thanks Ashley,

I'm running 360 and just simply trying to add an execute javascript trigger to a button and hot spot that will trigger the event in GA. The same string works when added to an object within the story_html5.html so I know it's connecting to the server correctly and accessing the .js file successfully.

This works as a button inside story_html5.html:

<button id="button" onclick="ga('send', 'event', 'button', 'ButtonClick');">Hit here</button>

But, this does not when called within StoryLine as an execute javascript on click from a button:

ga('send', 'event', 'button', 'ButtonClick');

I also have a page view trigger that's not firing from StoryLine as an event from Timeline Start:

ga('send', 'page view', '/PAGE2')

Logan Stahler

Hi everyone-

I wanted to share an update - Our web developer found the correct javascript code necessary to send page views from a SL360 project back to our GA account!  The codes that were shared earlier in this thread were not working, likely due to the new html output of SL360.  

If you have a project that you're deploying for the web, and you have a GA account set up and ready to collect, use the following javascript anywhere in the project that you want a page view to be reported to GA:

 

(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', 'GA_TRACKING_CODE', 'auto');

ga('send', 'pageview', 'PAGE_NAME');

 

NOTE: you will need to change 2 things in the code above for it to work for you:

1.  Change GA_TRACKING_CODE to the unique tracking code provided to you within GA - it’s under Admin, Tracking Info, and then Tracking Code.

2.  Change PAGE_NAME to whatever you want the title of your page/action to be.  For example, if you changed it to 'IntroSlide', then GA would report an IntroSlide page view when triggered.  Note that this could also be an action, like 'ClickedYesButton' - while GA shows it as a page view, you might find it useful to track clicks in this manner.  

Hope this helps!

Logan

Logan Stahler

Hi Abhishek-

I don't think that this process applies to anything within an LMS.  Because our product was being hosted on our web server (which is set up to handle GA), we were able to get the product to talk to GA.  As far as I know, you can't set up GA inside an LMS.  Basically, what you need is xAPI and an LRS to record your page visits!

This might work for you, too:  https://community.articulate.com/discussions/articulate-storyline/articulate-storyline-export-to-google-drive

That said, if anyone knows of a way to set up GA within an LMS, please share!

Sorry I couldn't help,

-Logan

abhishek chauhan

Hi Logan

Thanks for your reply. Could you help me in understand how can I validate whether GA works or not within an LMS. If you have ever tested it to work within an LMS, please share the process. We just want to validate or see how can we practically prove it that it doesn't work on an LMS. Thanks again!

 

G Ubhare

Hi Logan,

Thanks for sharing the code.

Will it be possible to track events using the same functions. Also, can you kindly show the way to call this function using the  Storyline trigger.

I have tried many times but it still does not show up in the GA. Does GA takes time to populate the data?.

Please advise.

Thanks

Logan Stahler

Hi Ganesh-

Yes, events should also be trackable, though I'm not certain how that would change the code.  To keep it simple, I might consider a page view in GA an event so I could use this same code.  Example - I want to track that a learner clicks a red button - instead of calling it an event and figuring out the new GA code needed so it is categorized within GA's events, I would just change the PAGE_NAME to Red_Button.  While GA will show it under the page category, I would know that it's my event. 

The trigger for this inside storyline is simply "execute javascript" (insert the above javascript) when X happens.  This could be when the timeline starts, when something is clicked etc.

-Logan 

G Ubhare

Hi Logan,

Thanks for the quick reply. So we have to use that code in every single trigger. I was creating an external .jS file  so don't have to copy that code in every single trigger and simply call the function from the trigger. May be that is why it was not working for me.

Will try including as is and see it works.

Many thanks

G Ubhare

HI Logan,

Tried to include the code as (replacing the google ID with my ID) is in each trigger but it's not tracking anything.

This is how my code looks in the trigger for page 1 button click

*************

(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-xxxxxx-2', 'auto');
ga('button', 'click', 'start');.

***********

Also, when I troubleshoot,  the source. It is calling the trigger and including the js file in the header each time the trigger is called. See attached, This is not good .

What changes did you make in the story_html5.html?

G Ubhare

Hmm. Not sure what's wrong. It simply won't track. Which version of the storyline you are using?

Are you sure your site is set up for GA correctly? Also, I assume you're hosting/running the file on the same site, right?

Yes. It shows that's one user is connected when I am on the site page so its tracking correctly

Also, I assume you're hosting/running the file on the same site, right?

it's tracking the no of users correctly.

Thanks for your help

 

Logan Stahler
Nicholas Soldatenko

You don't need Google Analytics to accomplish what you're trying to do. You can just set up a data table and save the clicks, visits, etc. with the Data Cloud widget. It's faster to do and the resulting data is easier to process. https://cluelabs.com/data-cloud-elearning-widget.html

 Hi Nicholas - are there directions on how to set up/use the widget?  I looked at the link you sent but haven't gone as fas as creating an account to get the widget.  Thanks for sharing this!