How to Add Video on a Web Page

If you want to stream a video file to the visitors of your website, The simplest of the process is:

1. Create a video file in a common streaming media format
2. Upload the file to your web server
3. Make a simple hyperlink to the video file

When the visitor clicks on the link the video opens directly in the proper player (if installed on the users machine) on the users machine.

Although this is the easiest way, but there are many cases when you want the video to play with-in the web page. For this you need to use special HTML tags to embed the video in a web page. Lets discuss three of the major types of video/movie files.

Real Media

To insert a real media into a web page, you need to insert the following code.

<OBJECT CLASSID=”clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA”

HEIGHT=”300″ WIDTH=”200″>

<PARAM NAME=”SRC” VALUE=”myvideo.rm”>

<PARAM NAME=”CONTROLS” VALUE=”ImageWindow”>

<PARAM NAME=”CONSOLE” VALUE=”myvideo”>

<PARAM NAME=”BACKGROUNDCOLOR” VALUE=”blue”>

<PARAN NAME=”center” VALUE=”true”>

<param name=”loop” value=”true”>

<param name=”autostart” value=”true”>

<embed src=”myvideo.rm” width=”300″ height=”200″ controls=”ImageWindow”

backgroundcolor=”blue” center=”true” console=”myvideo” loop=”true” autostart=”true”></embed>

</OBJECT>

Typically the OBJECT tags are used for compatibility with Internet Explorer and the EMBED tags are used for compatibility with Mozilla. One of the main attributes which you would like to set is the autostart property. Set it to “true” if you want the video to play automatically, else set it to “false”.

You can adjust various other attributes in the PARAM tags and the embed tags according to your specific requirements. For a detailed description of all the parameters and their functions please see the real media guide.

Windows Media

Use the following code to embed windows media into a web page:

<OBJECT ID=”MediaPlayer” WIDTH=”300″ HEIGHT=”200″ CLASSID=”CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95″

STANDBY=”Loading Windows Media Player components…” TYPE=”application/x-oleobject”>

<PARAM NAME=”FileName” VALUE=”myvideo.wmv”>

<PARAM name=”autostart” VALUE=”true”>

<PARAM name=”ShowControls” VALUE=”false”>

<param name=”ShowStatusBar” value=”false”>

<PARAM name=”ShowDisplay” VALUE=”false”>

<EMBED TYPE=”application/x-mplayer2″ SRC=”myvideo.wmv” NAME=”MediaPlayer”

WIDTH=”300″ HEIGHT=”200″ ShowControls=”0″ ShowStatusBar=”0″ ShowDisplay=”0″ autostart=”1″> </EMBED>

</OBJECT>

For various supported parameters list, please visit here.

Quicktime movie (.mov)

To embed quicktime movies into a web page:

<object classid=”clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B” codebase=”http://www.apple.com/qtactivex/qtplugin.cab” height=”250″ width=”320″>

<param name=”src” value=”myvideo.mov”>

<param name=”autoplay” value=”true”>

<param name=”controller” value=”true”>

<param name=”loop” value=”false”>

<param name=”type” value=”video/quicktime”>

<param name=”target” value=”myself”>

<embed height=”300″ pluginspage=”http://www.apple.com/quicktime/download/” src=”myvideo.mov” type=”video/quicktime” width=”200″ autoplay=true controller=true loop=false target=”myself”>

</object>

Hope this’ll help, good luck.