In Riddle 2.0 each Riddle type has the same set of events, making it easy to write a general event listener that will work with all Riddles. The events sent by a Riddle are listed in the table below. Along with the event action, Riddle will send an event name to specify the action. For example, the Block_View event will send the name of the block that was viewed as the event name. The CoreMetrics event will send the type of event for example “Start” as the event name.

EventEvent Action Name
Form or single form field submittedForm_Submit
Form or single form field skippedForm_Skip
Block submitted – either an answer option was chosen or the next button was clicked in a question blockBlock_Submit
Block skipped. A block was skipped and no answer was submittedBlock_Skip
Block viewed. A block was loaded and displayed to the userBlock_View
Social Shares. A social share button was clicked and a social share was initiatedSocial
Call to action button clickedCta
Core Metrics that you can also see on the analyze / statistics screen in the Riddle creator.
Events can be Start, View, etc.
CoreMetrics
Lead Settings events send data such as cookies accepted as the event nameLeadSettings

Unless you are using your own, custom tracking script, you will be able to use these events with the most common tracking tools such as Facebook/Meta Pixels, Google Analytics, Google Tag Manager or Matomo straight out of the box with Riddle 2.0.

Please refer to our post on how tracking works with these tools to learn more.

JS events and event handling for Riddle 1.0

How to catch JS events in general

The following example is written in Javascript and catches the ‘view-quiz-result’ event. Feel free to alter this snippet to any event from below.

function onMessage(event) {
    if (event.data && event.data.riddleEvent) {
        var riddleData = event.data.riddleEvent;
        if ('object' === typeof (riddleData)) {
            if (riddleData.action === 'view-quiz-result') {
                // Your code here
            }
        }
    }
}
window.addEventListener("message", onMessage, true);

 Lead form events

  • form-submit
  • form-skip

IMPORTANT: when listening to form-submit and form-skip events, there is no action associated to them.

Thus the even listener will have to be riddleData === ‘form-submit’ instead of riddleData.action === ‘form-submit’

Please check your code if you are not getting form-submit events. Most likely you added .action to riddleData

Listen to these events to determine, if someone has reached your result page. The finish-quiz and view-result events are shown when the last question is answered. If you added a lead form, the finish events will show when the lead form is loaded and NOT when the result page is shown after the form is submitted or skipped.

General events

  • page-change: this event is basically the same as ‘turn to the next question’ but it is the same for every quiz type
  • cta-click: this event fires when a CTA button placed on a result page is clicked.

 JS Events every quiz type has in common

Start QuizAnswerFinish QuizSee ResultsTurn to next QuestionIndividual events
Quizstart-quizanswer-quizfinish-quizview-quiz-resultview-each-questionanswer-correct-quiz
Personalitystart-personalityanswer-personalityfinish-personalityresult-personalityview-quiz-of-personality/
Opinion Pollstart-pollanswer-pollfinish-poll///
Surveystart-survey/finish-survey/view-question-of-survey/
Liststart-list/finish-list/view-each-item-in-list/
Journey/Interactive Storystart-narrativeanswer-narrativefinish-narrativeresult-narrative / unique-result-narrativeview-page-of-narrativeunique-result-narrative
Reaction Pollstart-sentiment/////
Ranked Liststart-rankedlistanswer-rankedlistfinish-rankedlist///
Tap & Findstart-spot//view-spot-resultview-each-spot/
Order Itstart-lineup/finish-lineupview-lineup-resultview-each-lineup/
Multi Pollstart-poll2020answer-poll2020finish-poll2020///

Got any problems? Feel free to contact us on Intercom or send an email to hello@riddle.com

More on our events can be found here.

Leave a Comment