by Andreas

HTML 5 video in Sharepoint 2010

For those who want video support in their Sharepoint site there’s finally a very easy way to do this that doesn’t depend on the Silverlight media player. It’s all done using HTML 5 and an excellent video player called VideoJS (http://videojs.com/).

Pre-req: check my previos post about how to run HTML 5 in Sharepoint here. This part is required for it to work, and I am not covering it in this post.

Download the video-js-2.0.2 library (present version at the time of this post). There are three files of interest: demo.html, video.js and video-js.css.

1. View the demo.html file in your browser to verify that it works

2. Upload the .js and .css files to your Sharepoint site assets library (or wherever else you feel like storing it)

3. Open the source of the demo.html and copy the entire contents to your clipboard

4. Create a new Content Editor Webpart on your Sharepoint page, and open up the content HTML editor (this was also covered in that previous post). Paste in the demo.html source, and update the two source references to your asset files! You have to update both the .js and the .css. (My .js path was  <script src="/HTML5/SiteAssets/video.js").  Click OK.

5. How about that:

image

If you encounter any errors my guesses are:

1. You didnt alter the masterpage like i described in that previous post (you won’t get the link again!)

2. You are viewing your Sharepoint site in an OLD BROWSER (IE 9 required, or the latest version of Chrome, Safari or Firefox)

3. Your references to video.js and video-js.css are wrong. My site was called HTML5, and had a library called SiteAssets directly at the root level and gave me the path <script src="/HTML5/SiteAssets/video.js"

  • Nanaki

    great..! but seems that caption/subtitles function can’t display correctly… any idea?