Hi, I have used same method listed here in my site but I am unable to track YouTube videos in my site.
It’s API enabled YouTube embed video. I am using the custom code taken from the adobe forum and added in customize page code. Media module have been added in library management. Same code is working for one site but not in any of our other sites.
Can you help fix this problem.
References used :
https://33sticks.com/dynamically-track-youtube-videos-adobe-analytics-no-development-required/
https://helpx.adobe.com/dtm/kb/how_to_track_youtube_videos_using_DTM.html
Video is in iframe tag with an id.
<iframe src="https://www.youtube.com/embed/u7_-5vCewbA?autoplay=1&rel=0&enablejsapi=1" frameborder="0" allowfullscreen="1" id="player0"></iframe>
Custom page code used:
/*YouTube Player updates required by Adobe Video Tracking module */
var n=0;
jQuery('iframe').each(function() {
var src = jQuery(this).attr('src');
if(src){
if (src.indexOf('youtube.com') > -1) {
if (src.indexOf('?') > -1) {
if (src.indexOf('enablejsapi') == -1) {
src = src + '&enablejsapi=1';
}
} else {
src = src + '?enablejsapi=1';
}
jQuery(this).attr('src',src);
jQuery(this).attr('id','player' +n);
n++
}
}
});
/* YouTube Player Mapping (https://developers.google.com/youtube/iframe_api_reference) */
var playerInfoList=new Array();
$("[id^='player']").each(function(){
var player=$(this).attr('id');
playerInfoList.push(player);
});
var players=new Array();
window.onYouTubeIframeAPIReady = function() {
for(x=0;x<playerInfoList.length;x++){
players[x] = new YT.Player(playerInfoList[x], {
events: {
'onStateChange': onPlayerStateChange
}
});
}
}
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING) {
var videoPlayer = "YouTube";
var videoTitle = event.target.getVideoData().title;
var videoId = event.target.getVideoData().video_id;
var mediaName = videoPlayer+'|'+videoId+'|'+videoTitle;
var mediaLength = Math.floor(event.target.getDuration());
var mediaOffset = Math.floor(event.target.getCurrentTime());
if (mediaOffset == 0) {
Math.floor(event.target.getCurrentTime());
mediaOffset = Math.floor(event.target.getCurrentTime());
s.Media.open(mediaName,mediaLength,videoPlayer);
s.Media.play(mediaName,mediaOffset);
} else {
mediaOffset = Math.floor(event.target.getCurrentTime());
s.Media.play(mediaName,mediaOffset);
};
}
if (event.data == YT.PlayerState.PAUSED) {
var videoPlayer = "YouTube";
var videoTitle = event.target.getVideoData().title;
var videoId = event.target.getVideoData().video_id;
var mediaName = videoPlayer+'|'+videoId+'|'+videoTitle;
mediaOffset = Math.floor(event.target.getCurrentTime());
s.Media.stop(mediaName,mediaOffset);
}
if (event.data == YT.PlayerState.BUFFERING) {
var videoPlayer = "YouTube";
var videoTitle = event.target.getVideoData().title;
var videoId = event.target.getVideoData().video_id;
var mediaName = videoPlayer+'|'+videoId+'|'+videoTitle;
Math.floor(event.target.getCurrentTime());
mediaOffset = Math.floor(event.target.getCurrentTime());
s.Media.stop(mediaName,mediaOffset);
}
if (event.data == YT.PlayerState.ENDED) {
var videoPlayer = "YouTube";
var videoTitle = event.target.getVideoData().title;
var videoId = event.target.getVideoData().video_id;
var mediaName = videoPlayer+'|'+videoId+'|'+videoTitle;
mediaOffset = 0;
s.Media.stop(mediaName,mediaOffset);
s.Media.close(mediaName);
}
}
/* Loads IFrame Player API Code asynchronously */
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
/* Media Module Config */
s.enableVideoTracking=true
if(s.enableVideoTracking){
s.loadModule('Media');
s.Media.autoTrack=false;
s.Media.playerName='YouTube';
s.Media.segmentByMilestones=true;
s.Media.trackMilestones='25,50,75';
s.Media.trackUsingContextData=true;
s.Media.contextDataMapping = {
'a.media.name':'prop11',
'a.media.view':'eventN11',
'a.media.complete':'eventN15',
'a.media.timePlayed':'eventN16',
'a.media.milestones':{
25:'eventN12',
50:'eventN13',
75:'eventN14'
}
}
s.Media.trackVars='events,propN11';
s.Media.trackEvents='eventN11,eventN12,eventN13,eventN14,eventN15,eventN16';
}
