Ron's Guide

To add music to a webpage, all you need to do is use the <embed> tag to have the music be embedded straight into your page. Using the <embed> tag will allow your visitors to control the music directly from your webpage. All you need to do is define the src of your music file. Here's an example:

Depending on which media player your browser uses, the code above will produce somthing this:

To get it working, all you need to do is replace path/to/mymusic.mid with the URL to your music file. You can also add additional options by using some of the attributes that go along with the <embed> tag.

For example, you can change the height and width of the media player above with the height and width attributes. Just add them to the embed tag like this:

The code above will make it nice and compact, like shown below:

Some other useful attributes are the autostart, loop and hidden attributes.

If autostart is set to false (the default is true) the music will not start playing until the user clicks the play button on the media player control bar.

If loop is set to true (the default is false) the music will start playing again automatically when it reaches the end.

If hidden is set to false (the default is true) the media player will not show in the browser window.

Here's an example of how to use these attributes:

In the example above, I could have just left out the autostart attribute, because the default is already true, but I just wanted to demonstrate how to use these attributes for those who didn't already know.

That's it! Pretty easy huh? I hope this tutorial helped you.

• Discuss this tutorial
• Rate this tutorial
• Tell a friend