Stream Flash videos on your site with Dreamhost FLV converter and LongTail Media Player

May 15, 2009 / Filed under: Video, Flash, Dreamhost

With easy-to-use camcorders like the Flip gaining popularity and use, it's often helpful to be able to post recorded videos directly to your own website, without having to first post to YouTube or another video sharing site.

Dreamhost users can remove the middle-man, and quickly convert and embed video files for display on any website.

Dreamhost's Flash media utility converts any AVI, MPEG, or MOV files to web-friendly format FLV, and then let's you embed on any site with just a few lines of JavaScript code.

Convert the file

To convert your AVI, MPEG, or MOV file to FLV, you'll need to be a Dreamhost customer and have access to their web panel.

Once there, go to Goodies > Flash Media. Follow the instructions on screen to convert your file to FLV.

Screenshot of Dreamhost web panel

Copy code

The suggested code to embed the FLV on your site is immediately provided by Dreamhost, but it could use some improvements.

<script type="text/javascript" src="https://media.dreamhost.com/swfobject.js"></script>
<div id="1_480x360.flv"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</div>
<script type="text/javascript">
var sd = new SWFObject('https://media.dreamhost.com/mediaplayer.swf'
,'mpl','480','360','8');
sd.addParam('allowscriptaccess','always');
sd.addParam('allowfullscreen','true');
sd.addVariable('height','360');
sd.addVariable('width','480');
sd.addVariable('file','http://www.matthom.com/1_480x360.flv');
sd.write('1_480x360.flv');
</script>

No external references

First thing you may consider doing is copying the external JavaScript files to your own server, instead of referencing media.dreamhost.com as the src attribute. This will ensure no decrease in your site's performance if media.dreamhost.com happened to be unresponsive.

This would be applicable for the very first line:

&lt;script type="text/javascript" src="https://media.dreamhost.com/swfobject.js"&gt;&lt;/script&gt;

So, for this site, the new src could look like:

&lt;script type="text/javascript" src="http://paininthetech.com/javascript/swfobject.js"&gt;&lt;/script&gt;

Also, the actual media player itself is being referenced from media.dreamhost as well:

var sd = new SWFObject('https://media.dreamhost.com/mediaplayer.swf'

Copy the SWF file to your own server.

Comments/Mentions

# software developers at 8/13/2009 1:04 pm cst

That was an inspiring post,

very clear and inspirong article ,I loved it so much

Keep up the good work