WordPress.org

Ready to get started?Download WordPress

Plugin Directory

Secure HTML5 Video Player

Secure HTML5 Video Player allows you to play HTML5 video on modern browsers. Videos can be served privately; pseudo-streamed from a secured directory

This section describes how to install the plugin and get it working.

  1. Upload the 'secure-html5-video-player' folder to the '/wp-content/plugins/' directory
  2. Activate the plugin through the 'Plugins' menu in WordPress
  3. If you are self serving videos from a cache directory, make sure your webserver is configured so that 'video/ogg' and 'video/webm' are recognized file types.
  4. In Settings -> Secure HTML5 Video Player, specify the directory (or the S3 service) where the videos are located.
  5. Upload your videos and images to the directory or service you specified.
  6. Use the [video] shortcode in your post or page using the following options.
Video Shortcode Options

file

The file name of the video without the file extension. The video directory set in the control panel is searched for files with this name and with file extensions: mp4, m4v, ogv, ogg, theora.ogv, webm, png, jpg, jpeg, and gif. The files that match are automatically used in the video tag and poster displayed in the page. For example, if you have videos: myclip.mp4, myclip.ogv, myclip.webm, and the poster image: myclip.png; you need only set a file value of "myclip". To select a video in a subdirectory within the video directory, use the relative path to the video file from the video directory.

[video file="myclip"]

[video file="path/to/myclip"]

vimeo

The Vimeo video ID. A Vimeo video can be used as the primary video, with the HTML5 video as a fallback mechanism if the video is not available on the Vimeo service. A Vimeo video can alternatively be used as the fallback when a specifed HTML5 video is not available.

[video vimeo="46623590"]

youtube

The Youtube video ID. A Youtube video can be used as the primary video, with the HTML5 video as a fallback mechanism if the video is not available on the Youtube service. A Youtube video can alternatively be used as the fallback when a specifed HTML5 video is not available.

[video youtube="u1zgFlCw8Aw"]

mp4

The file name or URL of the h.264/MP4 source for the video.

[video mp4="video_clip.mp4"]

ogg

The file name or URL of the Ogg/Theora source for the video.

[video ogg="video_clip.ogv"]

webm

The file name or URL of the VP8/WebM source for the video.

[video webm="video_clip.webm"]

poster

The file name or URL of the poster frame for the video.

[video poster="video_clip.png"]

width

The width of the video.

[video width="640"]

height

The height of the video.

[video height="480"]

preload

Start loading the video as soon as possible, before the user clicks play.

[video preload="yes"]

autoplay

Start playing the video as soon as it's ready.

[video autoplay="yes"]

loop

Replay the video from the beginning after it completes playing.

    [video loop="yes"]

controls

Enable or disable video playback controls. (Only applies to the "native" skin.)

[video controls="no"]
Video Shortcode Examples

Video URL example

[video mp4="http://video-js.zencoder.com/oceans-clip.mp4" ogg="http://video-js.zencoder.com/oceans-clip.ogg" webm="http://video-js.zencoder.com/oceans-clip.webm" poster="http://video-js.zencoder.com/oceans-clip.png" preload="yes" autoplay="no" width="640" height="264"]

Video File Example using default settings

[video file="video_clip"]

Video File Example using custom settings, with Youtube set as a fallback

[video file="video_clip" youtube="u1zgFlCw8Aw" preload="yes" autoplay="yes" width="1600" height="900"]

Requires: 3.0 or higher
Compatible up to: 3.9.2
Last Updated: 2014-6-17
Downloads: 72,463

Ratings

4 stars
4.3 out of 5 stars

Support

2 of 3 support threads in the last two months have been resolved.

Got something to say? Need help?

Compatibility

+
=
Not enough data

0 people say it works.
0 people say it's broken.

80,10,8
100,1,1
0,1,0 67,3,2
100,4,4 100,5,5
0,2,0
100,1,1