HTML5 Video Tracking Using GTM
This demo uses a video Gutenberg block. Having a built-in video block is super handy for website owners who want to self-host their videos (as opposed to using YouTube, Vimeo, etc.).
Behind the scenes, Gutenberg generates an HTML5 video tag to embed a video in a post/page.
The not so good news is there isn’t a native way for Google Analytics to track HTML5 video play events. Yes, even in this day and age where video pretty much rules.
But, the good news is there is a way to track these events without starting from scratch. You’ll need to be pretty comfortable with Google Tag Manager though ;-).
To see the video play events in real time:
- Open Omnibug in your dev console.
- Open your GA Realtime > Events report in a separate window.
The HTML5 Video
Next Steps
1) I just added support for tracking video events by user ID. The tests results aren’t in yet. Please stay tuned.
Support for user ID tracking is live as of 28 October 2020.
2) I also want to port this GTM solution to a Universal Analytics implementation. This will most likely be in the form of a WordPress plugin. Stay tuned.
The WordPress plugin version is done and available on GitHub. See the live demo page.
Learn
Want to learn how to set this up? Check out the complete how-to guide on Dev.
What about YouTube videos? You can test-drive my new GA4YT plugin that tracks YouTube video events (including logged-in user tracking).
Credits
This solution is based on Julius Fedorovicius’ article, HTML5 Video Tracking Recipe for Google Tag Manager posted on Analytics Mania.
