The Vimeo video is inserted by entering its ID number. The player has options to show/hide the Title, the Byline and the fullscreen button. It can be set to autoplay and loop but these are NOT recommended!
The controls color can be changed by entering a hex color number without the hash (#) sign.
There is a heading, an optional date field and a large box for entering descriptive text.
The link to Vimeo for visitors to link to or embed the video is also optional.
The items are inserted in an HTML5 section element which can be styled with a border.
The item can be made responsive by checking the "Full Width" box in the Metrics inspector and setting a maximum width as can be seen by the above example.
A hosted videos such as Vimeo are displayed in an iframe. To make this responsive, the code requires the intrinsic aspect ratio to be calculated and inserted in the widget settings. This is calculated from …
video file height ÷ by the video file width x 100
A video with an aspect ratio of 16:9 has an intrisic aspect ratio of 56.25. If the aspect ratio is 4:3, the intrisic aspect ratio is 75 ans so on …
The comments section is optional and uses Disqus. It requires the Disqus "shortname" for general use and the page URL and identifier for use with a specific podcast or videocast.
The optional footer has a function for auto updating the website copyright date and a smooth scroll, back to the top chevron style tab. Along with a suitable header/navigation widget, this allow the creation of a fully responsive page which will display correctly on computers, tablets and mobile phones.
© info & date