Put Video on a Web Page

Do you have a website and you want to add videos to it? If so, you've come to the right place. There are many ways to do this, and here are just some.

Steps

YouTube Videos

This is the simplest of all methods. This way, you can embed videos in your web page with no code knowledge whatsoever. Also, you do not need to host the video yourself.

  1. Go to YouTube.
  2. Search for the video which you want to include, or upload your own.
  3. Find the embed option on the page, or, if you are watching this YouTube video on a website other than youtube.com, (in other words, if it is already embedded) the option will appear at the end of the video.
  4. Copy the code supplied to the clipboard. (Right Click > Copy or Ctrl > C for Windows users.)
  5. Paste the code into your webpage where you want the video to appear. (Right Click > Paste or Ctrl > V for Windows users)

Inline Video

Inline video is another easy way to include video in your webpage. The problem with this kind of video though, is that it can be found annoying and some people may have changed their browser options so that inline videos are not shown. It is also not easy to control the way that the video is played.

  1. Locate the file. The recommendation is that you upload the video to your own server, rather than hot linking (directly using) video on other websites.
  2. Put the URL of the file in an <img> tag.
    For example:
    <img="Example.avi">
  3. Add this code to your webpage, changing Example.avi to your file.

Plug-ins

Plug-ins are mini programs that you can embed in a web page. In the case of video playback, it is a media player. Some examples of these include Windows Media Player, QuickTime and Real Media.

  1. Locate the file, as in the Inline Video section.
  2. Embed the file. This can be done in a few ways. Here are some examples:

QuickTime Movie (.mov)

  1. Use the following code as an example:

    <object width="160" height="144"
    classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
    codebase="http://www.apple.com/qtactivex/qtplugin.cab">
    <param name="src" value="Example.mov">
    <param name="autoplay" value="true">
    <param name="controller" value="false">

    <embed src="sample.mov" width="160" height="144"
    autoplay="true" controller="false"
    pluginspage="http://www.apple.com/quicktime/download/">
    </embed>

    </object>
  2. Add this code to your web page, changing Example.mov to your file name, and changing some of the parameters if you like.

Real Video Movie (.rm/.ram)

  1. Use the following code as an example:

    <object width="320" height="240"
    classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">
    <param name="controls" value="ImageWindow" />
    <param name="autostart" value="true" />
    <param name="src" value="Example.ram" />
    </object>
  2. Add this code to your web page, changing Example.ram to your file name, and changing some of the parameters if you like.

Hyperlinks

One of the other ways to add a video to a web page is to hyperlink it. This simply means linking to it. The file opens on its own, using a plug-in (see above).

  1. Use the following simple code as an example:

    <a href="Example.avi">
    Click here to play a video file
    </a>
  2. Add this code to your webpage, changing Example.avi to your file name, and changing some of the parameters if you like.



Tips

  • The keyboard shortcuts should work for Apple operating systems if you replace the Ctrl with the command key.
  • Make sure you save your HTML before you attempt this, so you can recover any mistakes you may make.
  • You can also press the menu button on embedded videos from YouTube to display the embed option while you are still playing the video.
  • It is recommended that you know the basics of HTML before attempting this.

Warnings

  • Do not upload anything copyrighted to YouTube, or use/link to any copyrighted video on your website. This is a criminal offence in most countries.

Related Articles