Embed Vimeo video's on your website

—  Using Vimeo allows you to embed videos on your website. You can choose for the videos to start playing immediately and loop.

Before you start

It is important not to slow down the loading speed of your website too much (and also to keep the user experience high), the file of the video should not be larger than 8MB. You can use online tools such as online-convert.com to prepare your video for online use.

 

In online-convert.com, you can use the following settings:

  • Preset 1280×720 HD 25p
  • Filesize: 1-7MB
  • Cut video: 00:00:00 – 00:00:07 (a shorter video is smaller and loads faster)
  • Disable audio track

Vimeo

Now that you have the correct file size for your video, go to Vimeo and create an account.

Once you have created an account you can upload a video.

New video > upload.

  1. Change the appearance of the player in the right bar by switching the toolbars on and off.
  2. Save
  3. Embed icon ‘share link’ and press the blue copy button

4. Go to your Popeye media library > add multimedia

5. Add a title and copy the link from your Vimeo video at insert from URL

6. Add this parameter to the end of the player URL in your embed code:
?background=1 : This parameter automatically disables all elements in the player (play bar, buttons, etc), autoplay, loops, and mutes your video on load.

7. Save

It may happen that the video does not load on mobile phones if e.g. your battery saving mode is active. For this you can set an alternative image so that if the video does not load this image is shown.

In the media library, open the picture you want to set up. Copy the ID (e.g. 96766) and go to the video you want to link to. Open this video and paste the ID of the image into the Media Poster (Image ID).

Tips 'n tricks

Don't have a good video available yourself? We are happy to give you some websites where you can download free videos: pexels.compixabay.comcanva.com