Warning: Cannot modify header information - headers already sent by (output started at /home/jerwon11/divtagtutorials.com/wp-content/plugins/captcha/captcha.php:1) in /home/jerwon11/divtagtutorials.com/wp-content/plugins/wp-super-cache/wp-cache-phase2.php on line 60
How to Insert Vimeo Video Player into Weebly Landing Page

How to Insert Vimeo Video in Video Landing Page

The YouTube player is the default video player in the Video Landing Page. If you want to use a Vimeo video player, you can also do so by adding 1 more step:

 

 

 

 

 

 

 

1) Get the Vimeo Embed Code

a) First go in Vimeo to get the Vimeo embed code for your video. Next open your Notepad/Wordpad (PC) or Text Edit (MAC) and paste the copied code in a new blank page.

The Vimeo code will look something like this:

<iframe src=”http://player.vimeo.com/video/49173058?title=0&amp;byline=0&amp;portrait=0&amp;color=9c1e1e” width=”500″ height=”281″ frameborder=”0″ webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p><a href=”http://vimeo.com/49173058″>ASOS Puma ‘Os Pixadores'</a> from <a href=”http://vimeo.com/pulsefilmsltd”>Pulse Films</a> on <a href=”http://vimeo.com”>Vimeo</a>.</p>

b) We don’t need the entire code, just the first section that is highlighted above.

c) Here we also need to check if the size of the video is correct

<iframe src=”http://player.vimeo.com/video/49173058?title=0&amp;byline=0&amp;portrait=0&amp;color=9c1e1e” width=”500″ height=”281″ frameborder=”0″ webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

In the width and height area, you should see 500 for width and 281 for height. If this is not the number you have, you need to change it to 500 width and 281 height in order to fit into the Video Landing Page.

Click to Enlarge Image

2) Edit Video.html 

Once we have the Vimeo code ready, go into your Weebly Editor and click into the video.html page.  Locate this code in video.html:

<!– Insert Youtube Video ID HERE –>
<iframe width=”498″ height=”280″ src=”http://www.youtube.com/embed/EiRE9PuJsDs?wmode=transparent” frameborder=”0″ allowfullscreen></iframe>

Here we will replace the entire YouTube <iframe> code highlighted above with the new Vimeo code we just prepared.

This is how it will look like when the Vimeo code is pasted in:

<!– Insert Youtube Video ID HERE –>

<iframe src=”http://player.vimeo.com/video/49173058?title=0&amp;byline=0&amp;portrait=0&amp;color=9c1e1e” width=”500″ height=”281″ frameborder=”0″ webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

Click to Enlarge

Vimeo Code – Click to Enlarge

3) Save & Publish

 

 

Tags: