EverWeb Widgets

PLYR MP4 Video Player

A responsive video needs to be able to supply the video file at different sizes for the various devices.
The large video file available in this player is 1080px wide and has a file size of about 120 MB. This is obviously far too large for mobile devices like the iPad and iPhone. The settings button allows visitors to choose the quality. In this case they are 1080, 720 and 576 available from the Settings button in the control bar.
This video is created using PLYR. It can handle self hosted MP4 video and hosted video in the Vimeo and YouTube formats. It has extra functions for Picture In Picture, Airplay and fullscreen playback.
Make Money
For those who want to monitise their website, the player can run ads from VI (Video Intellignede) simply by checking a box and entering a publisher ID.
SEO
Far too many webmasters seem to be compketely unaware that their videos cannot be indexed by the search engines. For this to happen, the video needs to be enclosed in an HTML5 container with a caption for the video title and a paragraph for a description of the content.
This video is in a <figure> element with a <figcaption> for the tile and a <p> for the descriptive text.

VI Info

MP4 Video Player Setup

The video player requires a poster image to show on page load and the MP4 video file in at least two sizes.
Poster Image
The video file is prevented from downloading at page load to speed up the page download time so a poster image with the same aspect ratio as the video file is inserted.
Video Files
The player allows for between two and four video files to be made available to visitors via the settings button in the player's control bar.
The files are dragged into the EverWeb Assets List and selected via buttons in the widget settings panel.
Each video file should have its file width inserted in the box provided. This size will appear in the player's Settings popup panel.
The video files would normally be inserted in order of the file size - from smallest to largest.
The first video file selected is the one that will download in the player at page load.
Controls
There are checkboxes to show/hide the indiviual control bar items and the various video player functions.
The controls are the large play button, the play button, progress bar, current time, mute buttom, volume control, settings button and the fullscreen button.
Player functions
There is control for setting the initial volume and checkboxes for auto pause, autoplay and muted.
If the aspect ratio of the video file is anything other than the default 16:9, there is a control to change it and prevent letter boxing.
Player Ads
There is a checkbox to turn on ads from Video Intelligence and a box for entering th VI Publisher ID.
Text
The text area is optional but is really essential for SEO and should be used to enter the video title and a brief description of the video content with suitable keywords.
Video File Size Conversion
If only a large or HD MP4 video is available, the smaller versions can be quickly created using the freeware Miro Video Converter.

Miro Video Converter