Adding a Youtube video background to an Instablock

Using the following custom-coded solution you can add any public Youtube video as a video background for any of your page blocks. The video will play automatically, without sound.

Note: The video must be public in order for this solution to work. Please make sure that your video is set to Public from YouTube's settings before proceeding. This code works with Youtube videos only.

The information you will need to set this up on your landing page is the Youtube video ID and the page block on which you would want to have the video background.

How to get the Youtube video ID

image of youtube ID in the browser URL

NOTE: Please make sure you only copy the ID of the video, without other parts of the URL or the time parameter that is sometimes added after it.

The following code needs to be added under Settings - JavaScript, Footer: 

 

Now you will need to add your own Youtube video ID in the videoID parameter

image of adding the video ID parameter to your code snippet 

And the page block on which you want to have the video background

image of adding the correct block number in the code that you want to have the video on

 In the example above, we are adding the video background to the first block of the page from the top. If you want to add it to the second block, you will need to replace 1 with 2, and so on if you want to add it to any other block.

The next step is to add the CSS styling for this feature, the code below needs to be added under Settings - HTML/CSS - Header:

 

Note: The video background will not be available on mobile devices or mobile screen sizes.

In case you need help with a custom functionality or any code customization that is not provided through our Help Center articles we have a Professional Services team that can help our Convert users. The Convert plan includes Professional Services as well as additional features and services that can be seen here: https://instapage.com/convert-benefits