Community Advisor

Solved

YouTube Video tracking through Adobe Launch?

Forum|Forum|3 years ago
May 20, 2022
3 replies
6846 views

Need to track the following events:

Video Start (how many times was play clicked?)
Video 2 sec played
Video 30 sec played
Video 25 % played
Video 50 % played
Video 75 % played
Video 100 % played
Video paused

How we can track it? Could you please help.

I used some YouTube extension as mentioned below but sometimes its working sometime not working.

Analytics

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Best answer by Jennifer_Dungan

I had a similar issue with the Adobe plugins.... My solution, which is a bit odd, is a "Frankenstein" mix between GTM and Adobe.

I use GTM's YouTube Video trigger and built-in Video Variables to drive a custom html script tag. In this tag I set a window level object to hold the information about the video.. things like the title, id, status, % completed, etc. Then here is where I trigger a custom JS event.

<script>
  // initiate the custom event if not already present
  if (!videoTrackEventShared){
    var videoTrackEventShared;
    videoTrackEventShared = new Event('videoTrackEventShared');
  }

  // set variables based on build in vars (probably overkill, but I like to be able to easily swap out or manipulate things here, rather than in-line where I set the data
  var videoStatus = {{Video Status}};
  var videoTitle = {{Video Title}};
  var videoPercent = {{Video Percent}};
  var videoURL = {{Video URL}};
  var videoId = videoURL.substring(videoURL.indexOf("v=") + 2);

  // Set Window Object
  window.sharedVideoData = {"title":videoTitle, "videoId":videoId, "videoEvent":videoStatus, "videoPosition":videoPercent+"%"};

  // Dispatch Custom Event
    window.document.dispatchEvent(videoTrackEventShared);
</script>

GTM Trigger:

In Adobe, I created a rule to listed for that JS event, then read the object and set my Adobe Analytics tracking that way. You could also in theory try and leverage the GTM data layer (I was having issues with that and for expedience reasons I just did my own thing).

Adobe Custom Code Event:

document.addEventListener('videoTrackEventShared', function (e) {
  trigger();
}, false);

Then I just pick up the values from the window.sharedVideoData with my Data Elements, and use them as I need in my Adobe tracking.

I have found this solution to be the most reliable solution for us.... though as I said, it's a bit of an odd solution... I just felt like the GTM YouTube trigger (with both YouTube and GTM being Google products) might be more apt to stay up-to-date and functional (though.. I don't have 100% faith in that), but since the YouTube API seems to constantly change which was causing me a lot of headaches before, and this solution has now been in place for over a year and is still working, I think it's pretty solid....

Jennifer_Dungan

Accepted solution

Community Advisor and Adobe Champion

I had a similar issue with the Adobe plugins.... My solution, which is a bit odd, is a "Frankenstein" mix between GTM and Adobe.

I use GTM's YouTube Video trigger and built-in Video Variables to drive a custom html script tag. In this tag I set a window level object to hold the information about the video.. things like the title, id, status, % completed, etc. Then here is where I trigger a custom JS event.

<script>
  // initiate the custom event if not already present
  if (!videoTrackEventShared){
    var videoTrackEventShared;
    videoTrackEventShared = new Event('videoTrackEventShared');
  }

  // set variables based on build in vars (probably overkill, but I like to be able to easily swap out or manipulate things here, rather than in-line where I set the data
  var videoStatus = {{Video Status}};
  var videoTitle = {{Video Title}};
  var videoPercent = {{Video Percent}};
  var videoURL = {{Video URL}};
  var videoId = videoURL.substring(videoURL.indexOf("v=") + 2);

  // Set Window Object
  window.sharedVideoData = {"title":videoTitle, "videoId":videoId, "videoEvent":videoStatus, "videoPosition":videoPercent+"%"};

  // Dispatch Custom Event
    window.document.dispatchEvent(videoTrackEventShared);
</script>

GTM Trigger:

In Adobe, I created a rule to listed for that JS event, then read the object and set my Adobe Analytics tracking that way. You could also in theory try and leverage the GTM data layer (I was having issues with that and for expedience reasons I just did my own thing).

Adobe Custom Code Event:

document.addEventListener('videoTrackEventShared', function (e) {
  trigger();
}, false);

Then I just pick up the values from the window.sharedVideoData with my Data Elements, and use them as I need in my Adobe tracking.

I have found this solution to be the most reliable solution for us.... though as I said, it's a bit of an odd solution... I just felt like the GTM YouTube trigger (with both YouTube and GTM being Google products) might be more apt to stay up-to-date and functional (though.. I don't have 100% faith in that), but since the YouTube API seems to constantly change which was causing me a lot of headaches before, and this solution has now been in place for over a year and is still working, I think it's pretty solid....

yuhuisg

Community Advisor

On the other hand, this means that you have two tag management systems running on the same web page.

Jennifer_Dungan

Community Advisor and Adobe Champion

True, but we had that anyway... Our GA tracking is all done through GTM because business wants separation of concerns... also our AdOps people have access to GTM but not Adobe so that they can add remarketing pixels if needed (I wouldn't trust them in Adobe Launch due to the constant sprint work that is being deployed into our Dev environments - they already don't look before deploying in GTM) . A lot of people are probably using both for a similar reason.

I agree, if you don't already have GTM on your sites, it's not worth adding for this... but if you do, you can leverage it to your advantage.

VaniBhemarasetty

Adobe Employee

@kamlesh-maddheshiya Here is the documentation on how track Youtube videos using Adobe Launch

https://experienceleague.adobe.com/docs/experience-platform/tags/extensions/adobe/youtube/overview.html?lang=en

yuhuisg

Community Advisor

@kamlesh-maddheshiya I am the developer of the YouTube Playback extension (your 2nd screenshot). What problems were you having with it? I'm happy to troubleshoot with you, perhaps over private message.

kamlesh-maddheshiya

Author

Community Advisor

Thank you @yuhuisg. I would like to connect. Could you please help to tell, how and when we can connect.

Email ID: seokamlesh22@gmail.com

yuhuisg

Community Advisor

Since @kamlesh-maddheshiya hasn't replied, I'll provide a follow-up on his issue:

TL;DR (summary) his website already included its own JavaScript code for tracking YouTube playback (i.e. in a JS file that was included in all pages), and that code prevented all of the YouTube-related extensions in Launch from working as expected. As a result, his failure was not really a failure of any extension per se.

Solution: If anyone else is facing the same issue here, I believe the fix would be for your website developers to remove all JavaScript code that handle YouTube video tracking. Then, you can use any of the available YouTube extensions in Launch to handle your video tracking, and things should work out just fine.

I am the developer of the YouTube Tracking extension, and helped Kamlesh to troubleshoot his issue. He had kindly provided me with the URL of some web pages that had YouTube videos loaded in them, but where the videos were not being tracked with any extension. He had included both my YouTube Playback extension and YouTube Player Embed. I focussed on troubleshooting my extension.

Initially, I thought that the problem lay with how the website handled consent after the user had granted it. But the consent manager was not at fault at all.

Instead, I finally discovered that there was a JavaScript file that was being included in all of the web pages. This JavaScript file included code for tracking playback, using a method that most YouTube tracking is based on. Nothing wrong with that, except for one crucial detail:

The YouTube IFrame API expects -- and really, allows -- only one global "onYouTubeIframeAPIReady()" function. After the YouTube IFrame API (at https://www.youtube.com/iframe_api) has been loaded, this global function is called automatically. This onYouTubeIframeAPIReady() is critical, because it sets up the videos to be able to use YouTube's IFrame API. So, all of the YouTube extensions rely on it to set up their tracking mechanisms.

However, since this is a global function, there can really be only one declaration of it at any one time when a web page is loaded. And since the web pages were loading that JavaScript file that also declared this global function, that JavaScript file's onYouTubeIframeAPIReady() function was being used all of the time. As a result, none of the onYouTubeIframeAPIReady() declarations in my extension and in any other YouTube extensions could get called by the user's browser.

I want to stress that there is nothing wrong with how any of the YouTube extensions have been developed. Instead, I would "blame" YouTube for having this one function that must be declared at the global context. But that's how YouTube has designed their API, and that's the restriction that the rest of us have to contend with.

I hope the above helps to close this issue.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded