Solved: Video Lead Magnet with Zoho Forms - Seamless Video Preview & Registration Form

Solved: Video Lead Magnet with Zoho Forms - Seamless Video Preview & Registration Form

Dear community,

I'm sure you've encountered video lead magnets before. An interesting video is offered tastily, so that apparently the video starts with a click. After that, however, the form for requesting contact data is displayed first. Only then does the video start or continue.

Other systems already offer ready-made templates here. However, this does not exist in such a form in the world of Zoho CRM and Zoho Forms. But that does not matter. With a little HTML code, which we use at CEYOND, you can easily implement this yourself, as you can see in this example.  

The trick is that two contents are displayed on the page: first a preview image of the video:

Video Lead Magnet - Screen 1

By clicking the mouse, the second and initially invisible content, the registration form, is displayed and the video preview image is hidden:

Video Lead Magnet - Screen 2

The form (Zoho Forms) then simply redirects to the actual video after it has been entered:

Video Lead Magnet - Screen 3

Our HTML code for that use case:

  2. <div id="ceyond_video_preview">
  3.   <a href="#" onclick="ceyond_video_click();">
  4.     <img width="800" height="465" src="video_preview_image.jpg 768w" />
  5.   </a>
  6. </div>
  7. <div id="ceyond_video_forms" style="display:none;">

  9.   *** Your Zoho Forms Code here ***

  11. </div>
  12. <script type="text/javascript">
  13. <!--
  14.     function ceyond_video_click() {
  15.        var p = document.getElementById('ceyond_video_preview');
  16.        var f = document.getElementById('ceyond_video_forms');
  17.        p.style.display = 'none';
  18.        f.style.display = 'block';
  19.     }
  20. //-->
  21. </script> 

You can see a full demo here.

Our recommended extensions to this solution are:
  1. Configuration of the events in Google Analytics (or any other tracking system) to be able to evaluate how many users click on the preview image, but then abort when entering the form.
  2. Replacing the preview image with a preview video that automatically redirects to the form input after a few seconds. This again increases the conversion rate.
We hope to have helped with this. If you have any questions and/or suggestions, please do not hesitate to contact us.