Embedding FLV Flash Movies into your SharePoint site

FLV files are simply a container movie file, and in order to present them to the user in a manner in which they will be able to control the playback of the movie you need to wrap them in an SWF playback control. Embedding flash video into a SharePoint site isn’t that much different than doing it in any other site. The only challenge is figuring out where and how the required files will be hosted and made accessible by the SharePoint site and its users.

I’m assuming you already have an FLV file, if not there are several converter applications available that will create FLV files out of common video formats. The next step is to find an FLV player that will present the video on our site. There are several third party FLV players available, many for free although some require licensing for commercial use. I’ve listed some here:

Each player has their own way of embedding, in this example I will use JW player. They have a neat tool on their site that you can use to generate the code needed to embed your video.

The player does require several files to be hosted and made readable by the user who will have access to the videos. You can create a dedicated document library and upload the appropriate files included in the FLV players package and then use the absolute URL in your embed code to reference them. Be sure that the users who will be watching the video have read access on the document library the FLV player files are stored in.

You then create a content editor web part in which you want the video to appear in and place the embedding code in the source editor. Here’s an example of JW Players embedding code:

<script type="text/javascript" src="http://www.mysite.com/JWPlayer/swfobject.js"></script>
<div id="mediaspace">This div will be replaced</div>
<script type="text/javascript">
  // <![CDATA[
  var so = new SWFObject('http://www.mysite.com/JWPlayer/player.swf','mpl','220','165','9');
  so.addParam('allowfullscreen','true');
  so.addParam('allowscriptaccess','always');
  so.addParam('wmode','opaque');
  so.addVariable('file','http://www.mysite.com/test.flv');
  so.addVariable('image','http://www.mysite.com/previewimage.jpg');
  so.addVariable('stretching','fill');
  so.write('mediaspace');
  // ]]>
</script>

In this case I placed all the FLV player files in the JWPlayer directory on “mysite” and am referencing the FLV file I want to have played.

Share on FacebookShare on Google+Share on RedditTweet about this on TwitterShare on StumbleUponEmail this to someone

Leave a Reply