How To Embed Video On Your Web Page
Discover Video makes it easy to embed live and on-demand video
in your own web page.
The easiest way to provide video is to simply insert a
hyperlink to the video viewing page your web site. Discover Video
customers may use the provided web viewing URL for their video. For
example, simply provide a hyperlink like
this.
Similar to the above hyperlink, you can easily launch this
page in a popup. To do this, use the following code:
Replace video=YOURURL with your Discover Video URL and replace
option YOURTITLE with your title text. Here is an example using the above code: Click Here
Be sure to set the width and height as desired.
You can easily embed the video player directly in your web
site too. You can use Windows
Media Player or Silverlight.(recommended).
Follow these instructions:
Windows Media Player
The following is for IE or FireFox users and assumes the
viewer has installed Windows Media Player, which is installed on virtually all
PC's, but not all MACs.
- Create a layer ("div") with a size and desired position. Note that video
will automatically scale to fill your layer. Because of this, you will want
to make sure the size is similar to the original video resolution size or
smaller (e.g. if the video is 320 x 240, make the layer approximately this
size and slightly higher to accommodate the player controls.
- Within the layer, insert the following code:
- Replace "YOUR VIDEO URL HERE" with your actual live or on-demand video
URL, as provided by the Discover Video system*
- Replace "STYLE" with one of the following choices:
- full -- displays full navigation interface.
Normally used for VoD.
- mini -- displays partial navigation interface.
Normally used for live.
- none -- displays video without controls. Must set
Autostart to "true" because no controls are displayed.
- Replace "AUTOSTART" with "true" or "false". If "true" then the
video will start with the page load.
Live video examples with AUTOSTART set to "false" and two
different layer sizes:
Small Layer with style set to "mini"
Larger Layer with style set to "full"
Your Windows Media Player video layer might look like this:
* For MPEG-2 multicast, use "vbricksys://ip=IP ADDRESS&port=PORTNUMBER".
For MPEG-4, use "vbrtsp://address/source"
Note: Some versions of FireFox have a known bug that may prevent
the video from displaying the proper size. As of this writing, the current
version shows this issue on Windows while older versions do do not. It
will most likely be fixed in future upgrades.
Silverlight
You can embed Silverlight in your web page, which provides
easy compatibility with IE, Firefox, and Safari browsers on both PC and MAC.
Silverlight is installed on most viewer's computers, but if the viewer does not
have it they will
be prompted to install it automatically.
- Create an inline iframe with a size and desired position.
It should be slightly larger than your video height and width.
- Set the iframe source to:
http://video.discovervideo.com/play/wm?video=YOURVIDEO&w=WIDTH&h=HEIGHT&stretch=fit&start=false&title=YOURTITLE&descrip=YOURDESCRIPTION&logo=YOURLOGO
- YOURVIDEO is your live or on-demand video URL
(mandatory)
- "WIDTH" and
"HEIGHT" are your desired settings (optional, default is 640 x
480)
- &stretch=fit (optional, if your source video is not
4:3 or 16:9 aspect ratio)
- &start=false If set to true, the video will
play upon page load(optional, default is true).
- &title=YOUR TITLE Text. (optional, see note)
- &descrip=YOUR DESCRIPTION Text. (optional, see note)
- &logo=YOUR LOGO The http path to your logo file.
(optional, see note)
- Notes:
- The player contained in the iframe will be larger or
smaller depending on the above options. Set your iframe size as desired.
- The &title= text will display a title above the video
- The &descrip= text will display your description
below the video
- The &logo= url will display your logo to the left of
your title
- If title, descrip, and logo are not included, the
iframe is a generic player on a white background
- There is a link to a Windows Media Player version and
to help below the player. If you do not wish to include these, set
your iframe size smaller to hide the links.
Live video example using Silverlight:
Your Silverlight video iframe might look like this (replace
YOURURL with your video URL):