/Youtube-Video-Tracking

Track user interaction with YouTube Videos

Primary LanguageJavaScript

Youtube-Video-Tracking

This will track if a user Plays, Pauses or Finished a video. It will also record progress of the video that has been watched in increments of 25. So it will track 25%, 50% and 75% on top of the initial 3.

Origin

This is not my original work, I have just modified it a bit from another source to work in the case I need. Such as adding the title as an available attribute for Analytics sake.

Original Repo: https://github.com/lunametrics/youtube-google-analytics

Usage

I have automated this the best I can so you can just import gtm-import.json and just update the UA code. You can also update the category if you would like to customize how it will show up in Analytics.

To update your UA code after you have imported the json file go to Tags > YouTube Video Interaction and update the Web Property ID to yours. This can be found in your Analytics Dashboard in the properties section of UA project you wish to track the data too.

Manual Way

Make sure you are in your GTM container, then follow the steps :)

  1. Creating DataLayers

    • Go to Variables
    • Under User-Defined Variables choose New
    • Choose variable type Data Layer Variable
    • Data Layer Variable Name
      • attributes.videoUrl
      • attributes.videoTitle
      • attributes.videoAction
    • Repeat b - d until you have 3 with the above variables. Custom HTML

  2. Triggers

    • Go to Triggers
    • Create a new Trigger with type Custom Event
    • Event name == youTubeTrack
    • Triggers on Some Custom Events
    • Dropdown 1, 2, 3
      • Video Interaction
      • Matches RegEx (ignore case)
      • Play|Pause|Watch to End|25%|50%|75% Custom HTML

Tags

Go to Tags and do the following 2 steps

  1. Send Data to Analytics

    • Create a New Tag
    • Choose Universal Analytics
    • Enter your Analytics ID from your Analytics Property
    • Track Type: Event
    • Category: YouTube Video Tracking (you can make this whatever you want)
    • Action: {{Video Interaction}}
      • This will report, PLay, Pause, 25% Watched, etc
      • This can be adjusted in the JS file if you need and know what you are doing.
    • Label: {{Video Title}}
      • This could also be sorted by the URL using {{Video URL}}
    • Add a trigger and choose YouTube Video Interaction
      • This can be named whatever you called it, its the trigger we created in step 2 Custom HTML

  2. Custom HTML

    • Create a New Tag
    • Choose Custom HTML
    • Copy and paste the script from youtube-tracking-script.js into <script> tags inside the box.
    • Add trigger and choose All Pages 
       <script>
 // Contents from youtube-tracking-script.js here
 </script>
      Custom HTML