Tracking YouTube Videos Using Element Tags

Videos are measured with the IBM Digita Analytics Element tag and send Explore attributes in specific locations. The tagging captures video start, pause and complete events using the embedded YouTube player and the YouTube JavaScript API. Note: this recipe follows the embedded YouTube iFrame API.

  • Element ID: pass the name of the video (e.g. Six Minute Abs)
  • Element Category: pass the category of the video (e.g. Fitness Videos)
  • Element Attribute Field 13: Pass the video status where “0”=Launch; “1”=Pause; “2”=Play;”3″=Completion. Video abandonment/completion rates and average video play times are calculated using the ‘Launch’ and ‘Completion’ events. ‘Pause’ and ‘Play’ events are sent on clicks to the YouTube video player ‘pause’ or ‘play’ controls.
  • Element Attribute Field 14: Pass the current video time (in seconds) of the status action. For example, if the user Stops the video 1:23 to the video, pass “83”. The video timestamp must be sent for all video status values including ‘Completion’, in which case the value should be equal to the Element attribute 15 ‘Video Length’ value.
  • Element Attribute Field 15: Pass the video length (in seconds) of the total length of the video. For example, if the video is 3:10 in length, pass “190”.

The video report Explore Attributes are like a hidden reporting setup in IBM Digital Analytics. The values need to be passed as Element Explore Attributes in fields 13, 14 and 15, but the Explore Attributes still need to be defined manually in the Explore Attributes admin.

Define the Explore Attributes in the Digital Analytics Admin console for “Element Attributes” as follows. Note: the element attributes 16, 17, 18, 19 shown in the image below are optional and can be used to further identify videos in custom reporting and are not required.

IBM Digital Analytics Video Element Attribute Setup
IBM Digital Analytics Video Element Attribute Setup


Below are sample “Element” tag function Calls with Video Explore Attributes: In this example we are tracking the video “Six Minute Abs” in an Element category “Fitness Videos” through a launch, pause, play and completion sequence. Note: the optional Video Type, Video Player, Video Ad Name and Video Url values aren’t sent to IBM Digital Analytics.

  1. When arriving at a page that auto-launches a video, send the values for 0 (Launch), 0 for the beginning of video and 90 for the total video length, assuming a 90 second video.
    cmCreateElementTag("SIX MINUTE ABS","FITNESS VIDEOS",

    "-_--_--_--_ --_--_--_--_--_--_--_--_-0-_-0-_-90");

  2. When a visitor clicks the ‘play’ control on the embedded YouYube video, send 2 (Play), 0 for the starting time for the current position assuming a start at the beginning and 90 for the total video length, assuming a 90 second video. Note: if a video doesn’t auto-start on page load, then clicking play on the embedded video should have 2 tags, the launch tag (step 1) and the play tab (step 2).
    cmCreateElementTag("SIX MINUTE ABS","FITNESS VIDEOS",

    "-_--_--_--_ --_--_--_--_--_--_--_--_-2-_-0-_-90");

  3. Visitor ‘pauses’ the video halfway through (45 seconds).
    cmCreateElementTag("SIX MINUTE ABS","FITNESS VIDEOS",

    "-_--_--_--_-- _--_--_--_--_--_--_--_-1-_-55-_-90");

  4. Visitor resumes play at 45 seconds
    cmCreateElementTag("SIX MINUTE ABS","FITNESS VIDEOS",

    "-_--_--_--_--_ --_--_--_--_--_--_--_-2-_-45-_-90");

  5. Visitor watches video to completion – note that timestamp (14) and video length attributes (15) are now equal
    cmCreateElementTag("SIX MINUTE ABS","FITNESS VIDEOS",

    "-_--_--_--_--_ --_--_--_--_--_--_--_-3-_-90-_-90");


Google recommends using the iFrame API for working with YouTube video events using the YouTube API. Please review the YouTube iFrame API Documentation before proceeding. It can be a bit tricky to get the listeners firing and calling your callback function, but the documentation is accurate and once the listeners are firing, calling IBM Digital Analytics should be straight forward.

The YouTube iFrame API allows a JavaScript developer to add an event listener through player.addEventListener(event,listener) function call or through registering a function callback onStateChange.
In the code, specify the integer values or preferably use one of the following namespaced variables for YouTube Player States:
YT.PlayerState.ENDED
YT.PlayerState.PLAYING
YT.PlayerState.PAUSED
YT.PlayerState.BUFFERING
YT.PlayerState.CUED
This value goes in the video event (Element Field Attribute 13) .

The current location (Element Field Attribute 14) can be obtained through a function call to player.getCurrentTime(). The value returned is in seconds.

The video duration (Element Field Attribute 15) can be obtained through a function call to player.getDuration(). The value returned is in seconds.