Adding Sounds/Music to Your Page


The Link Method
---------------------------

Here is an example link to a sound file:

<A HREF="http://www.factorycodes.com/sounds/bonny.wav">Bonny M Collections</A>

This will make the browser attempt to view the sound file. In this case, I used a midi file. You can do the same thing with .wav, .aud, and most other sound files. As long as the user has the helper application or plugin installed and their browser is configured to use these, the user will begin to download the file once they have clicked the link.

The browser opens a small new window to play back the file once it is downloaded to their computer. Once the file is downloaded, the window will begin playing the sound or music file automatically. The user can use the controls in their window to stop or start the sound. When they are through, they can use the right click method to save the file, just like an image file on a page. They can also close the new window and then return to browsing your site. The drawback to this method is that the user has to click a link and then wait for the file, but this has an advantage if you are going to have a large number of sound or music files for people to choose from.

Using the Embed Method
----------------------------------------

This method has become very popular way to play a sound or music file because it allows for many more options than a plain link does. The sound interface will be placed right on the page and can be configured to start automatically, repeat over and over, or just play through once. So, how do you do it? With the <EMBED> tag. This tag works in much the same way an image tag does. You will need to specify the source of the sound file and add additional commands as needed.This tag supports many common file formats... such as .wav, .mid, .mp3, and .au. Here is the basic structure of the tag:

<embed src="filename.ext" width="x" height="x" autoplay="x" hidden="x" loop="x" volume="x"></embed>

If you want the file to automatically play when the web page is loaded, set autoplay="true", if you do not want the file to automatically start, set autoplay="false". If you want the control box to be hidden, use the hidden="true" attribute. Normally the file will stop playing after it is completed the first time, so if you want it to start over once it is done use the attribute loop="true". You can set the volume setting with the volume attribute, a value from 1 to 100 (default is 50). The control box size that plays the sound can vary from browser to browser, but some versions of Netscape won't show the box at all unless you specify. (145 and 60 are usually good)

You may use multiple embed tags within one page, but it is recommended to never set more than one on autoplay. It is also not recommended to use .wav or .au files in the embed tag, because they are very large and take a few minutes to download. (.mp3 also falls into the category of "too large to use".)