PDA

View Full Version : Embed/Add Video to your webpage



W3bMa5t3r
02-23-2006, 07:20 PM
How to embed (add) a video to your webpage.
Complied By The "W3bMa5t3r"
(Thanks to 'tbird' for letting me use his video for these examples)

You need to have your video file hosted on a server. Either here at GotStang? (must be less than 1MB to be hosted on GS) or somewhere else. Once you have the file hosted somewhere continue with the information below:


--------------------------------------------------------------------------------

NOTE!!! The Example URL that is used in the follwing codes must be replaced with the URL for YOUR video. The example URL is:

http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.*

* = .mov or .wmv or .rm

Ensure!!! that you replace all instances of the Example URL with YOUR URL. :) If you want it to work right :-p

NOTE 2!!! I know my real media file doesn't work. It's a problem with my converter. It won't convert Real Media right for some reason and I wanted to get this up as quick as possible. The code will work though, just place the URL to your video in place of my example URL.


--------------------------------------------------------------------------------

Embeding a QuickTime (*.MOV) file/video, use this code, replacing the URL included, with the one you have for your video.

<?> Copy & paste the following...

<!-- begin embedded QuickTime file... -->
<table border='0' cellpadding='0' align="center">
<!-- begin video window... -->
<tr><td>
<OBJECT classid='clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B' width="640"
height="495" codebase='http://www.apple.com/qtactivex/qtplugin.cab'>
<param name='src' value="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.mov">
<param name='autoplay' value="true">
<param name='controller' value="true">
<param name='loop' value="false">
<EMBED src="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.mov" width="640" height="495" autoplay="true"
controller="true" loop="false" pluginspage='http://www.apple.com/quicktime/download/'>
</EMBED>
</OBJECT>
</td></tr>
<!-- ...end embedded QuickTime file -->
</table>



Embeding a Windows Media Files (*.WMV or *.WMA or *.ASX or *.ASF):

<?> Copy & paste the following...

<!-- begin embedded WindowsMedia file... -->
<table border='0' cellpadding='0' align="center">
<tr><td>
<OBJECT id='mediaPlayer' width="640" height="525"
classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95'
codebase='http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701'
standby='Loading Microsoft Windows Media Player components...' type='application/x-oleobject'>
<param name='fileName' value="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.wmv">
<param name='animationatStart' value='true'>
<param name='transparentatStart' value='true'>
<param name='autoStart' value="false">
<param name='showControls' value="true">
<param name='loop' value="false">
<EMBED type='application/x-mplayer2'
pluginspage='http://microsoft.com/windows/mediaplayer/en/download/'
id='mediaPlayer' name='mediaPlayer' displaysize='4' autosize='-1'
bgcolor='darkblue' showcontrols="true" showtracker='-1'
showdisplay='0' showstatusbar='-1' videoborder3d='-1' width="640" height="525"
src="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.wmv" autostart="false" designtimesp='5311' loop="false">
</EMBED>
</OBJECT>
</td></tr>
<!-- ...end embedded WindowsMedia file -->
<!-- begin link to launch external media player... -->
<tr><td align='center'>
<a href="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.wmv" style='font-size: 85%;' target='_blank'>Launch in external player</a>
<!-- ...end link to launch external media player... -->
</td></tr>
</table>



Embeding a Real Media (*.RM) File/Video:

<?> Copy & paste the following...

<!-- begin embedded RealMedia file... -->
<table border='0' cellpadding='0' align="center">
<!-- begin video window... -->
<tr><td>
<OBJECT id='rvocx' classid='clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA'
width="640" height="480">
<param name='src' value="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.rm">
<param name='autostart' value="false">
<param name='controls' value='imagewindow'>
<param name='console' value='video'>
<param name='loop' value="false">
<EMBED src="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.rm" width="640" height="480"
loop="false" type='audio/x-pn-realaudio-plugin' controls='imagewindow' console='video' autostart="false">
</EMBED>
</OBJECT>
</td></tr>
<!-- ...end video window -->
<!-- begin control panel... -->
<tr><td>
<OBJECT id='rvocx' classid='clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA'
width="640" height='30'>
<param name='src' value="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.rm">
<param name='autostart' value="false">
<param name='controls' value='ControlPanel'>
<param name='console' value='video'>
<EMBED src="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.rm" width="640" height='30'
controls='ControlPanel' type='audio/x-pn-realaudio-plugin' console='video' autostart="false">
</EMBED>
</OBJECT>
</td></tr>
<!-- ...end control panel -->
<!-- ...end embedded RealMedia file -->
<!-- begin link to launch external media player... -->
<tr><td align='center'>
<a href="http://www.w3bma5t3r.com/gotstang_hosted/tbird/trying_to_burnout.rm" style='font-size: 85%;' target='_blank'>Launch in external player</a>
<!-- ...end link to launch external media player... -->
</td></tr>
</table>



ADDING the code to your webpage.

Make sure you've changed the VIDEO URL in the above code to reflect the URL of YOUR VIDEO/FILE.

In the "Manage" box to the right, select "Website".
From "Website", select the car you wish to edit the page(s) of (if you have more than one car).
Once the desired car is selected, choose the page you wish to edit.
Now that the desired page to edit has been selected, you will see a cool webpage editor. In this editor go to the HTML VIEW (tabe at bottom of editor), scroll to the area where you would like to add your video file. Copy the code above !!!WITH YOUR VIDEO'S URL!!! in place of the example URL and PASTE the code. Once that is done, save the page and you should now have video in your page.


That's all there is to adding video to your webpage. :) Enjoy and I hope this helps. If you have any questions feel free to ask. I will be doing each section one at a time so look for more to come... Later...
W3bMa5t3r :beerchug:

J
02-23-2006, 08:29 PM
next time just link to your blog :)