Embedding a Video Directly into the Webpage

Written By: Brad Markle

Experience Level: Beginner
Print E-mail:
One way to avoid problems with making sure your visitors have the correct video player is to embed the video directly in your webpage. When you embed the video directly into the webpage it will play right on the page and you do not need to have any “special” video players. This process is a little more invloved than linking to a video however we will go over the basic steps to embedding a video into a webpage.

The first step is to download a video player that will play the video on your website. There are many various media player to do this, but for this example we will use a flash media player called mediaplayer.swf

Once you have downloaded the media player, you can now create your HTML code. This is a basic media player we are using , and many others have a lot more options. Here is the code to embed the video in the webpage:

<embed src=”mediaplayer.swf?file=video.wmv” width”854″ height=”480″ allowfullscreen=”true” />

Now, let’s take a few minutes to review the different parts of the code:

  • embed src= This is the basic embed code and stands for embed source
  • “mediaplayer.swf? This is  the file name and location of the actual video player we are using
  • file=video.wmv” This is the file name of the video the media player is supposed to play. Remember you will need the path to the file.
  • width-854″ height=”480″ This specifies how big the video player will be on the page. It’s best paractice to set the height and width to the same size of the video so the entire video plays and is not cut off
  • allowfullscreen=”true” This gives your visitors the option to make the video full screen, or keep it the size you specified.

Remember, this is just an example and there are many different media players available. Each media player may have different options availabe so remember to read over the media player’s documentation first. For more information from InMotion Hosting, please visit: http://www.inmotionhosting.com

 

Advertisement