Personalised Video Cover

Being able to add a personalised image cover on your Youtube video's can help increase plays, so why not!

In this guide we cover all the steps needed.

1. Create your personalised Image

This is pretty obvious step, but head over to Hyperise and create your video cover image.  In the example below we added the 'Video Frame' image, as well as the 'iMac Computer' image (both from the Hyperise Image Library) and then added a website personalisation layer to the iMac screen and Business Name in the title.

2. Websites

Now we have our image we need to jump over to the Websites and grab the website code.

3. Add to your website

Now head over to your website and add the JavaScript snippet to your page.  In this example we're using WordPress, but any website CMS should allow you to add custom Javascript.

4. Secret Sauce

The code example below now needs to be added to your web page, where you want the image/video to be displayed.

<div onclick="this.nextElementSibling.style.display='block'; this.style.display='none' ;  document.getElementById('video').src += '?autoplay=1';"> 
   <img src="https://img.hyperise.io/i/wZFevZJff.png" style="cursor:pointer" id="hyperiseImage1" /> 
</div>
<div style="display:none">
   <iframe id="video" width="560" height="315" src="https://www.youtube.com/embed/KiqkaEPAhtc" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

Copy the above code, change value (1) highlighted below to your Image template ID and change value (2) to your Youtube video ID.

Once this code is added, when your website visitor clicks the image, it will hide and your video will automatically start to pay...

5. Pulling it all together

To view the example we've created in this guide, visit: https://hyperise.com/personalised-video-cover/

This contains the code from the JavaScript as well as the "Secret Sauce" code we shared above and that's it nothing more.

This page will now be personalised when we append the utm_hyperef to the url, eg:

https://hyperise.com/personalised-video-cover/?utm_hyperef=ian@hyperise.com

(enriching and personalising from an email)

https://hyperise.com/personalised-video-cover/?utm_hyperef=18925_5

(personalising with data from a Google Sheet, row=5)

https://hyperise.com/personalised-video-cover/?utm_hyperef=facebook.com

(enriching and personalising from an domain)

https://hyperise.com/personalised-video-cover/?website=google.com

(enriching and personalising from an website)

https://hyperise.com/personalised-video-cover/?business_name=ACME

(personalising with a business name)

Once any of the above examples have been triggered, a cookie will be set, so subsequent visits just to  https://hyperise.com/personalised-video-cover/ will still be personalised.

Additionally we're using reverse IP Company lookup on this page, so businesses visiting who have a fixed IP will also see personalisation automatically from the first visit, without any parameter needed to be appended to the URL.