How to Embed Video/Audio on your Website

Embedding Video

If you want to have a video that will play right in your web page, you can embed the video.  Embed is a HTML tag that we have not discussed in previous sections that is used to place the video directly on the page.  There are a few steps involved in embedding a video and may take some trial and error, but below we have the basic steps.

First, you will need to download a video player file that will play the video on your website.  You can also embed a .wmv file and not have a video player file on your website, however in order for a .wmv file to play your website visitor must have Windows Media Player on their computer.  If your visitors have a Mac, they may not have Windows Media Player which is why in this example we are using a flash player.  There are many different files available that will assist you in playing an embedded video, however in this example we will be using a flash media player called mediaplayer.swf.

Once you have the file to play the video, you can create your HTML code.  This is a very basic player code that we use on our own website, there are others available on the Internet that may have more options.   We will go over the details in a moment, but here is the code:

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

Now we will break down the different parts to explain the code:

• embed src= - This is the base embed code and the attribute, which simply means Embed Source
• "mediaplayer.swf? - This is the name of the video player that you are using.  In our example, the media player is named mediaplayer.swf
• file=video.wmv - This tells the media player which file to play.  We have video.wmv uploaded directly into the public_html folder, if you have your video in a folder called Video (for example) then it would look something like file=Video/video.smv
• width="854" height="480" - Here is where you will specify how big the player would be.  To make sure the entire video is visible, it is best to set the width and height to be the same width and height of the video itself
• allowfullscreen="true" - This gives your visitor the option to make the video full screen, or keep it in the video the size that you have specified

As long as you have the correct path in file= and have uploaded the media player, on your website you should now have an embedded video.  Remember that there are lots of embed codes available on the Internet and you are not required to use this one, it is just an example of one way to embed your video on your website.

Embedding Audio

When embedding audio, it is essentially the same process as it is with video. The following is an example of the code you would use:

<embed height="50" width="100" src="/myaudiofiles/example.mp3">

Within this, you can also adjust the size of the audio player to best fit your individual site.