Google Analytics is a popular service for tracking visit and actions on your site. It’s easy to extend Google Analytics to keep track of scenes visited, animations played, and virtually any event that occurs in your Tumult Hype document.
Basic Setup
To setup Google Analytics track visits to your HTML page which contains your Tumult Hype document, simply copy and paste the <script>...</script> code that Google provides into the ‘Head’ area of your document. You can edit the contents of the <head>…</head> of your exported .html file by clicking on ‘Edit HTML Head’ in the Document Inspector.
For more advanced tracking, read on:
Advanced Event Tracking
This webpage outlines event tracking and explains in detail the different event types: https://developers.google.com/analytics/devguides/collection/analyticsjs/events
Please note that when testing this, you’ll need to have your Tumult Hype document uploaded to a web server belonging to the domain of your Google Analytics tracking code.
Here’s how to begin tracking events in Hype:
Install the Tracking Code
Before anything will work you’ll need to embed the provided Google analytics tracking code explained in ‘Basic Setup’ above.
Track an Event with Gtag
Google provides the following example for tracking an event:
gtag('event', <action>, {
'event_category': <category>,
'event_label': <label>,
'value': <value>
});
If you had a scene containing a video, you could run this function ‘On Scene Load’. Simple go to the scene, and add a ‘On Scene Load’ function and paste in the above code.
Load Scene or Document Names Dynamically
When loading JS in Hype, you have access to all of Hype’s APIs, so you could easily include the Scene Name in your events. Use hypeDocument.currentSceneName() wherever and Hype will write the scene name wherever used.
Example:
gtag('event', 'Load', {
'event_category': 'Scene',
'event_label': hypeDocument.currentSceneName()
});
You can also include hypeDocument.documentName() if you have multiple Hype documents on the same page.
For more ideas, please view the JavaScript documentation: http://tumult.com/hype/documentation/javascript/
. Looking at the code and what you've said as far as it being in the Head HTML, the most likely issue (from the Hype side) is that you don't have a hypeDocument object?