HostMonster Web Hosting Help

Embedding .avi, Quicktime and other media files

Problem:

How do I embed or use .avi, Quicktime, or other file formats?

Solution:

You can place and access Web-based video in one of two ways: the anchor tag <a href> and the <embed> tags. Using <a href> is the same as placing any link within an HTML document, but here is a refresher on how it looks:

      <a href="/video/golden.avi">goldenrod</a> 
        
If you use this method, your users will either save the file to their desktops, launch a helper application, or load a new browser page, depending on how they have set their preferences and which browser they are using.

If you want your video to stream during download or appear on the same page as the rest of your content, you will want to embed the clip in a page, using <embed>. The <embed> tag is syntactically similar to the <img> tag, and uses many of the same elements. Remember, though, that the embed tag requires users to have the appropriate plug-in installed. If they don't, they wwill not see your work.

The HTML for an embedded video file goes something like this:

     <embed src="/video/gore.mov" height=108 width=33% controller=false autoplay=true playeveryframe=false pluginspage="oops.html" loop=palindrome>
        
Elements specific to video include:
     height=pixel/percent
        
Unless you need your movie to scale, set this in pixels, according to how big your movie is:
     width=pixel/percent
        
Ditto.
     autoplay=true/false
        
        
Answer with "true", and your movie streams in with the page. Answer with "false", and the user must click to play.
     controller=true/false
        
This adds knobs that let your users control the movie. If you set this for "true", you'll want to add at least 15 pixels to the height of your movie. Otherwise the movie and the controller will be forced into the space required for the movie.
     loop=true/false/palindrome
        
If you want the movie to play over and over, set this to "true". If you want it to play once and stop, set it to false. If you set it to "palindrome", it will play from beginning to end and then from end to beginning, continuously.
     href=value
        
This just makes the movie link to something else:
     pluginspage="oops.html" 
        
This will take users who don't have the right plug-in to a page that tells them where to get it.

As with everything Web, there are no universal file formats or delivery standards for video. So, although I prefer QuickTime and the use of the <embed> tag, I would recommend offering a few different options for surfers to choose from. That way even more people can enjoy your awesome video work.

More tutorial links for embedding media files:

     /cgi/help/111
             
        
keywords: quicktime video audio media avi embedding
Knowledgebase Article 55,138 views bookmark tags: media quicktime (updated 1778 days ago)


Was this resource helpful?

Did this resolve your issue?


Please add any other comments or suggestions about this content:





Recommended Help Content

Example HTML to embed a streaming video file in a browser using Windows Media Player, (updated 1704 days ago)
Knowledgebase Article 103,484 views tags: audio media stream streaming video windows

Do you support the ASX media format on your web hosting? (updated 2059 days ago)
Knowledgebase Article 50,799 views tags: media streaming windows

How to Stream Quicktime Files (updated 1178 days ago)
Knowledgebase Article 93,062 views tags: mov quicktime stream

Related Help Content

Example on how to embed a flash file in a webpage (updated 1035 days ago)
Knowledgebase Article 119,949 views tags: audio embed flash swf video

There are many ways that you can transfer files and folder to and from your hosting account. We highly recommend using an FTP (File Transfer Protocol) program to quickly upload and download files. We (updated 1073 days ago)
Getting Started Article 153,037 views tags: file files filezilla manager setup

Learn how to see how many files you have on your account using the File Count tool in the cPanel. (updated 630 days ago)
Video "How-to" Tutorial 101,856 views tags: cpanel file

The Legacy File Manager will allow you to manage almost everything about your files, you can use it to upload, download, edit the code, change permissions and more! (updated 1616 days ago)
Video "How-to" Tutorial 91,557 views tags: cpanelutilities files upload

How to use a SWF file as your homepage without embedding it into an HTML page. (updated 2095 days ago)
Knowledgebase Article 67,881 views tags: flash page website

How to restore individual files or folders with the Site Backup & Restore tool (updated 1424 days ago)
Knowledgebase Article 95,980 views tags: backup files folders restore site

Short tutorial on how to set file and user Permissions in cPanel. (updated 1077 days ago)
Knowledgebase Article 152,695 views tags: file permission permissions rights

How do I Password Protect a single file on my website? (updated 1069 days ago)
Knowledgebase Article 107,269 views tags: file passwd password prompt protect secure single