<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=192061487988692&amp;ev=PageView&amp;noscript=1">

Displaying Coupon after Watching Youtube Video

Nov 21, 2014 12:57:00 PM  |  BY: Travis Logan


Youtube + Justuno = Another awesome way to incentivise:

We've been getting an increased number of people asking "Is Justuno capable of giving out the coupon after our website visitor finishes watching a video?".  Well I've put together this tutorial to show you just how easy that is to do.

youtube-coupon

Follow these easy steps to add this wonderful video incentivising strategy to your website.



Step 1:

If you haven't already done so create your Justuno Campaign.  You may want to create a seperate new campaign for your youtube videos.

Step 2:

Go to the design section of your Justuno Campaign and click on the "Custom Code" tab along the top. Copy & Paste this following code into the section labeled "Iframe JS Override"

Screen-Shot-2014-11-21-at-2.41.42-PM

$(function(){
$.getScript( "//www.youtube.com/player_api");
})

// create youtube player
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('youtube_player', {
height: $('#youtube_player').data('video-height'),
width: $('#youtube_player').data('video-width'),
videoId: $('#youtube_player').data('video-id'),
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}

// autoplay video
function onPlayerReady(event) {
event.target.playVideo();
}

// when video ends
function onPlayerStateChange(event) {
if(event.data === 0) {
/* record this and present coupon
/ since we dont have a youtube option yet, we'll record this as a facebook like.
/ if you want to record it as something else for reporting you can choose any of the below numbers.
/ 1 is facebook like
/ 2 is google plus
/ 3 is twitter tweet
/ 4 is newsletter subscribe
/ 5 is linked in
/ 6 is twitter follow
/ 7 is pinterest follow
/ 8 is instagram follow */
getpromocode('1','',currentcp);
}
}

Step 3: 

Add this code to your promotion description.  Adjust the height, width and youtube video ID as necessary.  The youtube video id is the unique ID that references your youtube video you want to show.  For instance if you go to youtube.com and go to a video page you'll see something similar to this in the URL http://www.youtube.com/watch?v=lyNZPBiOhXg.  In this case the lyNZPBiOhXg is the youtube video ID.

<div id="youtube_player" data-video-height="390" data-video-width="640" data-video-id="0Bmhjf0rKe8"></div>

Step 4 (final step): 

At this point your popup should be showing the video and should be giving out the coupon when it finishes playing.  You will likely want to go to the integrations page for your campaign and turn off all the options leaving the video the only way to get the code.

Topics: Videos