Streaming Video Using HTML5

In the last post we talked about using html5 for audio and html5 streaming video is almost the same.

Since the rapid rise of mobile phones you will notice that a high percentage of your visitors are visiting your website on smartphones or tablets and these have quite strong security filters. Part of this filter removes flash which was the top streaming platform for a number of years and so now we cane use html5 streaming video.

Again there are lots of great plugins for WordPress however it is pretty simple. You simply add code like this to the source of your page. The red text is where you link to your graphic. Try and make it the same size as your video. The blue is where you will add your video and the width can be in pixels or percentage.

<video controls=”controls” poster=”your graphic.jpg” preload=”none” src=”Your Video.mp4” width=”100%”></video>

You can also add any of these controlsList=“nofullscreen nodownload noremote foobar” For the technically minded more controls

Tip: sometimes it will keep putting the height back in so just save your work from the text screen to stop it. Also to remove the download icon add controlsList=”nodownload” after the width.

<video controls=”controls” poster=”your graphic.jpg” preload=”none” src=”Your Video.mp4″ width=”100%” controlsList=”nodownload”></video>

WordPress Plugins

Of course there are quite a few great plugins for wordpress now.