Tracking how long an embedded video was watched | Community
Skip to main content
Level 2
August 23, 2019
Solved

Tracking how long an embedded video was watched

  • August 23, 2019
  • 2 replies
  • 20997 views

Hello-

I am trying to edit some video tracking mechanisms into landing page templates using munchkin. I was able to implement the below code without issue and am able to track video starts and finishes. However, I want to be able to parse out how much of the video they watched into percentages ( like 25%, 50%, 75%). I have tried implementing code shown here: nation.marketo.com/groups/dallas-user-group/blog/2016/08/25/track-youtube-videos-in-marketo  but the video wont embed on the page whenever i try.

Is there a way to edit my current code ( below) to capture the percentages?

<div id="player"></div>  
<script>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
document.getElementsByTagName('head')[0].appendChild(tag);

//Change 'iiqxcjxJ5Us' to video needed
var player, videoId = '{{my.Links_YoutubeID}}';
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: videoId,
events: {
'onStateChange': onPlayerStateChange
}
});
}

function onPlayerStateChange(event) {
switch( event.data ) {
//Send video started event to Marketo
case YT.PlayerState.PLAYING: Munchkin.munchkinFunction('visitWebPage', {
url: '/video/'+videoId
, params: 'video=started'
}
);
break;
//Send video finished event to Marketo
case YT.PlayerState.ENDED: Munchkin.munchkinFunction('visitWebPage', {
url: '/video/'+videoId
, params: 'video=finished'
}
);
break;
}

}
</script>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍
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 SanfordWhiteman

The code at

   MktoMunchkin :: YouTube Players x3 plus Percent, Gross Time

has 3 independent YouTube players, each tracking elapsed time (in seconds) and elapsed percent (time / duration).

2 replies

SanfordWhiteman
Level 10
August 23, 2019

Can you highlight your code (as JS) using the Advanced Editor's syntax editor? I can't read it otherwise.

fordejpAuthor
Level 2
August 23, 2019

Sure, I put it here: Youtube Embed - JSFiddle 

I tested this and it works great to see if a video has been watched ( started and finished), just want to get a bit more granular if possible. I created a token for the youtube ID so the this can live in design studio and the program its used with can define what Youtube ID to track. Thanks so much for your quick reply and help!

SanfordWhiteman
Level 10
August 23, 2019

I mean highlighted here on the Community.