List of contents:
- Introduction
- Access Token Setup
- Adding Videos with the Shortcode Editor
- Automatic Video Captions and Splash Images
- Quality Switching
- HLS and MPEG-DASH Support
- Privacy Settings
- Troubleshooting
Introduction
We really like Vimeo video hosting here at Foliovision. Vimeo offers creative film makers almost unlimited hosting for just $59.95/year (Vimeo Plus). Even more unbelievable, unlimited commercial video hosting for marketers and commercial websites with privacy is just $199/year (Vimeo Pro).
We made sure FV Player Pro integrates seamlessly with Vimeo as it's the closest-to-perfect and almost headache free video hosting available right now. With FV Player Pro you can enjoy an unbranded player with very little decoration putting your content front and centre.
You can also customize your autoplay, width and height settings. Both automated and manual quality switching works as well with the Vimeo files. Any time Vimeo updates their video API, we'll update FV Player Pro almost immediately, saving you lots of work.
Access Token Setup
Vimeo Plus or Pro account is required. Vimeo support is a core part of our FV Player Pro features.
Due to Vimeo terms of use we require that we check your account before serving videos via FV Player. Click on the create a new Vimeo App (or after logging in to Vimeo alternatively use link: https://developer.vimeo.com/apps/new).
To create a new app, simply fill in your site name, site description and site URL. And of course agree with terms and conditions and click create an app.
Go to Authentication tab, scroll down and click the Generate Token button and copy your your access token.
Insert your access token to Settings > FV Player Pro > Hosting tab > Vimeo (Pro) and click Save All Changes.
Click Save All Changes afterwards.
Adding Videos with the Shortcode Editor
Open the shortcode editor in a post (or page) and insert the video URL into video box. You need to use the numeric Vimeo URL in it's full form. For example: "https://vimeo.com/197701695".
Adding a Vimeo video through FV Player's shortcode editor
You can set width and height of your video and select an underlying splash image. If you do not choose a custom splash image, Vimeo splash screen will be used instead automatically. To set a splash image simply click in the shortcode editor to "add image" and choose one from your library or upload a new one. The image should have the same size (pixels) as the player.
Click insert and publish. Here is the result:
A video with a custom splash image:
City of Bratislava
City of Bratislava by Ondrej VolkoAnd here is the example with a Vimeo splash image:
Patagonia
Patagonia by Steffen SailerAutomatic Video Captions and Splash Images
As mentioned above, FV Player automatically parses the splash image from Vimeo in the case you don't select it manually. This also happens with the captions. If you don't add a caption manually, then the player will use the video title. This is a default enabled for all the Vimeo hosted videos.
If you for some reason want to turn the auto captions off, you can do so in Settings > FV Player Pro > Hosting tab > Vimeo (Pro) and check the box Disable video titles.
If you want to use a different splash image than the one that player pulls automatically from Vimeo, you can always change it for any other you want. You can upload or set a splash image in the shortcode editor.
Quality Switching
You can set up quality switching. In Settings > FV Player Pro > Hosting > Vimeo (Pro) > tick Enable quality switching > Save All Changes. When you do not choose this option, HD quality will be used at all times with exception of iPhone and Android phone that will be served mobile quality.
There is no need to upload videos in different qualities or any additional settings on Vimeo. Simply one click as described above will solve it. This setting also detects mobile and serves mobile quality automatically (with option to switch). Here is how it looks like:
NOTE: There's no need to setup the other quality switching, this works independently. In case you mix self-hosted videos with Vimeo, it's the first video that determines which quality switching will be used. Then if the file for the selected quality is not available, the default one will be picked.
Quality Switching Defaults
There are two rules that will determine the default quality of the Vimeo videos:
- If the quality switching is disabled, then desktop users will receive the HD quality, and mobile users receive the mobile quality.
- If the quality switching is enabled, it checks the player size and picks the best quality for the current player size, unless you are on Android or iPhone. If you then select some other quality, it’s remembered for the whole site (all other videos will start with in this quality).
HLS and MPEG-DASH Support
FV Player supports Vimeo's HLS and MPEG-DASH streams, and can play such videos on the majority of devices - in the case of HLS with the help of Flash fallback and HLS.sj. Read more about HLS in this guide - Using HLS With FV Player. You can also read this post to learn more about the MPEG-DASH technology.
Privacy Settings
With Vimeo Pro/Plus subscription you can set up custom privacy settings to stop your video from appearing on vimeo.com, to disable embedding of your videos, or to stop download of your videos. Settings can be changed anytime per chosen video, or they can be applied to all your videos at once.
How to stop videos from appearing on vimeo.com?
Go to vimeo.com, hover your profile image, select Account Settings, click Videos in the left-hand menu, scroll down to Who can watch this video?, select Hide from vimeo.com. In case you want this setting to be applied for all your videos tick the box Also apply to all existing videos. Click Save.
Make sure embedding is allowed on your webpage. In Settings > Videos scroll down to Where can your videos be embedded?, select Only sites I choose, click + Add domain and enter your domain(s). If you want your settings to be applied to all videos, select Also apply to all existing videos. Click Save.
How to disable download of my videos?
In Settings > Videos scroll down to What can people do with your videos?, uncheck the box Download them. If you want this setting to be applied for all your videos, select Also apply to all existing videos. Click Save.
Troubleshooting
In case you experienced some issues regarding Vimeo video playback, you can switch to iframe embedding by turning on the Force iframe Embedding option in Settings > FV Player > Hosting > Vimeo (Pro). Click Save All Changes. From that time on Vimeo videos will be embedded via iframe in your site instead of fvplayer shortcode.
Leave a Reply