Adding share button/social media buttons to video.js

Posted on January 8, 2013 in Open source

If you ever were un-happy with youtube html5 support or had to look on self hosting your own videos and publishing them to get rid of youtube ads at the end – then you must probably ran into video.js.

“Video.js is a JavaScript and CSS library that makes it easier to work with and build on HTML5 video, today.
This is also known as an “HTML5 Video Player”.
Video.js provides a common controls skin built in HTML/CSS, fixes cross-browser inconsistencies, adds additional features like fullscreen and subtitles, manages the fallback to Flash or other playback technologies when HTML5 video isn’t supported, and also provides a consistent JavaScript API for interacting with the video.”

All cool and nice and easy to implement and skin – however there is one tiny missing feature. A share button.

You can probably create your own skin and shit – but I found a quick workaround that makes it look like you added a share button.
I am publishing cuz I did not find many search results that solve this – and there could be a poor or lazy soul looking for this.

You can download the workaround here and take a look at the compressed file containing the code and play the video featuring one of my favorite singers.

Here is a link to the page preview.

Ahla!