Google Analytics with Riddle 2.0

You can enable Google Analytics tracking on the publish step of your Riddle if you are subscribed to our Business or Enterprise Plans.

Go to the Publish Step -> Tracking and enable Google Tag Manager / Analytics tracking.

Google Universal Analytics now uses the same methodology for tracking as Google Tag Manager, which is why we have one option for both tracking setups.

Set up Google Tag Manager or Google Analytics Tracking in Riddle

Still using Google Analytics?

Note: if you are still using the old and outdated Google ‘ga’ Tag for Analytics, please enable the ‘Google Analytics (deprecated)’ Tracking in Riddle.

Everything else works just as described above.

Using Google Tag Manager with Riddle’s quiz maker

As long as you embed the Riddle on a page where you run your standard Google Tag Manager Tag, all standard Riddle events will be send to the GTM tag.

If you have customized your tracking code and are not using dataLayer as your object variable, you can enable the Custom Google Tag Manager configuration and change the default from ‘dataLayer’ to whatever you are using.

Please make sure to only change this value – only if you’re 100% sure you know what you are doing.

Lastly, you can configure which events you want to track. Open the custom event configuration and uncheck events that you do not want to track. By default, we are sending all Riddle events to GTM.

Read more on the events we send here.

That is really all you need to do for Google Analytics tracking with the Riddle Quiz Maker.

This is the default event we send to Google Analytics if you are using Universal Analytics:


    eventCategory: riddleEvent.category,
    eventAction: riddleEvent.action,

If you are using the old, deprecated Google Analytics “ga” tag, we are sending this event:


Google Analytics Tracking with Riddle 1.0

Please note that tracking Riddle events with Google Analytics is a fairly advanced feature. You will need to have:

  • basic skills in Javascript
  • access to your server to upload a PHP file
  • access to your HTML code to add Javascript

If you are using a Website builder like WIX, the method below will most likely not work, as you do not have the ability to upload PHP files.

The best (and easier) alternative to the method below, is to use Google Tag Manager with Riddle and Google Analytics. This requires far less coding, no PHP file upload and it should work with all website builders that allow you to add Google Tag Manager tracking scripts (which should be quite standard).

Here are our instructions on how to set up GTM with Riddle.

Google Analytics – tracking quiz events

The main difficulty of tracking Riddle events in your Google Analytics account is, that Riddles are running in iFrames on your website. This makes tracking events inside that Riddle iFrame a bit tricky. Especially for Google Analytics, which cannot be set up to track events on a domain like, which does not belong to you.

If you want to track page views or events from your embedded Riddle, you need to listen to events sent out by the Riddle iFrame and then trigger Google Analytics events accordingly.

Here are the key components needed for this. All the steps below are needed, do not skip one of them please as this example will not work in Google Analytics otherwise. 

a) a Riddle embedded on your own website

b) an empty iFrame added manually below the Riddle embed

c) JavaScript on the page where the Riddle is embedded (there are 2 variations of that JavaScript below depending on what you want to track). Make sure to check for the correct event name, when tracking things like “result page loaded”. Our JS Events and the corresponding event name are listed here. Change this part in the script accordingly: riddleData.action == ‘view-quiz-result’

d) a PHP file hosted on your servers on a https:// secured domain

e) the JQuery library loaded before you load the Riddle script. You can load JQuery from a CDN here. If you do not want to use JQuery please alter the script below and convert it to classic Java Script.

The iFrame

Add this iFrame code right below the Riddle embed. Make sure to keep the ID as is or if you need to change the ID, alter the JavaScript accordingly. The JavaScript below will load the external PHP file into this iFrame and pass it the necessary parameters that Google Analytics needs.

<iframe style="display:none;" src="" id="ga-iframe"></iframe>

JavaScript on Page

There are 2 variations of this script.

Variation 1:

This version only fires the Google Analytics tracking on the result page of your Riddle and is probably the preferred method. This way you do not count each and every Riddle slide as an individual page view. If you would rather trigger Analytics for every new Riddle page, use variation 2 please.

    function onMessage(event) {
    if ( && {
        var riddleData =;

        if ('object' === typeof(riddleData)) {
            if (riddleData.action == 'view-quiz-result') { //note: this ensures that only the result page fires Analytics.
                    'google-analytics-iframe.php' + //make sure to change this to the location of the PHP file
                    '?action=' + riddleData.action +
                    '&category=' + riddleData.category
window.addEventListener("message", onMessage, true);

Variation 2:

This version fires Analytics every single time, the Riddle advances to a news slide

            function onMessage(event) {
                if ( && {
                    console.log("Riddle event received:",
                    var riddleData =;

                    if ('object' === typeof (riddleData)) {
                                'google-analytics-iframe.php' +
                                '?action=' + riddleData.action +
                                '&category=' + riddleData.category
            window.addEventListener("message", onMessage, true);

Google Analytics: external PHP File

Create a PHP file and name it google-analytics-iframe.php and add the code listed below.

Upload this file to your server.

If you want to give it a different name or place it in a directory outside of the directory where the page with your riddle is located, make sure to adjust the JavaScript line 10 accordingly

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-ID']);//Replace this with your analytics ID

_gaq.push(['_trackEvent', 'RiddleCategory', '<?php echo $_GET['category']; ?>']);
_gaq.push(['_trackEvent', 'RiddleAction', '<?php echo $_GET['action']; ?>']);

(function () {
var ga = document.createElement('script');
ga.type = 'text/javascript';
ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);

See full example here:

If you follow the steps above, you will see the event in Google Analytics as follows:

Google Analytics Events from Riddle

Leave a Comment