In this section, we will share how to track YouTube video playback on the website. In fact, Google Tag Manager has a built-in Youtube Video Trigger. It is very easy to track using this trigger.
YouTube Video triggers will work both on and after page load, so long as at least one of these items is present when Tag Manager loads:
- An embedded YouTube video.
- The YouTube IFrame API <script>.
This is a requirement and must be met before it can be used.
Create a test page
Let’s first create a youtube play page on the blog: first go to https://www.youtube.com/watch?v=sxm45EgfJok and click share to copy the code on Embed:
Paste to the newly created Youtube Test page, the effect is as follows:
This page https://www.bbccss.com/youtube-test is the page we need to track. You can visit.
Setup process
1、Turn on built-in variables
There are already many built-in variables in Youtube video triggers, which will be used later. Let’s enable them first. Click Workspace> Variables> Configure, check all the Video type:
2、Set Triggers
Click Workspace> Triggers> New, Select YouTube Video and name it YouTube:
There are 4 types of Capture options:
- Start: Fires an event when the video begins to play.
- Complete: Fires when the video finishes.
- Pause, Seeking, and Buffering: If the video is paused, the scrub bar is moved, or if the video buffers, the trigger will fire.
- Progress: Fires at specified video progress points, configured by percentage or time threshold values:
- Percentages: This value indicates the percentage of the video that has been played. Enter percentages as a comma separated list of one or more integers. Example: 5, 20, 50, 80, which represents 5%, 20%, 50%, and 80% respectively.
- Time Thresholds: This value represents the number of seconds that the video has played. Enter time thresholds as a comma-delimited list of one or more integers. Example: 5, 15, 60, 120, which represents 5 seconds, 15 seconds, 60 seconds, and 120 seconds respectively.
- Advanced——Add JavaScript API support to all YouTube videos: This must be checked.Check this box to enable the YouTube iFrame Player API. This ensures that the
enablejsapi
parameter is appended to YouTube video player URLs with an assigned value of 1. This enables the player to be controlled via iFrame or JavaScript. Note: This will cause the video to reload if it plays when Tag Manager loads. - Enable this trigger on: Select the appropriate option, For best results Window Load (gtm.load) is the recommended option.
- Container Load (gtm.js) occurs as soon as possible when the page loads.
- Window Load (gtm.load) (default) occurs after all initial content on the page has loaded.
- DOM Ready (gtm.dom) occurs after DOM is ready to be parsed.
Here we track the basic operations of the video, such as Start, Complete, Pause, Seeking and Buffering, configured as follows:
3、Set Tags
Make the following settings on Tags:
4、Preview
See, events are all triggered:
You can go further to see what data can be passed in this event, click Variable, and down, these are the data passed by video tracking, and can be set to Event Action and Event Label to pass to Google Analytics:
Then to Google Analytics real-time reporting:
We Done~!!