***** HOW TO WORK WITH AUDIO FILES V3.1 ***** Posted by: BluesPlayer ----------------------------------------------------------------------------------------- Change History 6-11-07 : V1 Original file 6-25-07 : V2 Eliminated parameters from Media Player so it would fit the Eons 800 character limit. 7-4-07 : V3 Changed all double quotes to single to avoid any Eons server mismatches 7-21-07 : V3.1 Fixed the "About Me' box instructions ----------------------------------------------------------------------------------------- 1. Introduction There are a bunch of audio file types that are on your computer. You can tell the type of file it is by looking at it's "extension"... the letters after the dot (".") in it's name. The most common sound files are WAV files (example: drumsound.wav). This type of file is OK for short sounds but it tends to be large in size for the amount of audio it contains. By now, everyone should have heard of MP3 files. These are used for music and speech; they are widely used because they compact the sound into a much smaller space without the loss of a lot of quality. For example, a 40MB WAV file will only be about 3 or 4MB when converted to an MP3. These smaller files are used extensively not only because you can fit more in a given amount of disk space (or on a small MP3 player) but because they load a lot faster onto a web page. That's why MP3's are the file type of choice when doing audio on the web. There are other audio file types, examples are RealPlayer and WMA, but we will only be covering the basic use of audio and the players that turn the files into actual sound. *********************************************************************************************** 2. Creating the Audio For any music you may want to post on your profile page (or anywhere else), you need two things: the MP3 file and a place on the web to put it. The first part is easy; the second is not. If you love a song on one of your CD's you can use Media Player or a host of free tools on the web to "rip" the song. This process takes the music from an audio CD and puts it on your computer as an MP3. Windows has it's own version called a WMA, pretty much the same thing from your side of the fence. So the process of taking a song from a regular CD and putting it on your computer is called "ripping". Now that you have the song, you want to share it. Unfortunately, this is illegal, or at least the activity is embroiled in controversy. No one is condoning any activity here so let's look at a different case. You have a "band" and you recorded some ORIGINAL songs that you want to share with the world. You have them on your computer as MP3 files and you want to put them on the web. Ahhh. Now this is legal. So is recording your own voice as an audio message. This is very easy to do if you have a desktop microphone connected to the "mic" input on your computer. Go to Start / All Programs / Accessories / Entertainment and click on "Sound Recorder". Click on the red recording button, Stop and then File / Save to create a simple message. This will be WAV file so the longer the message, the bigger the file. If you are recording a multi-minute message, you will want to convert that WAV file to an MP3 for all the same reasons given above. There are lots of free conversion programs on the web like "MP3 Workshop". Just Google it. *********************************************************************************************** 3. Getting The Songs Onto The Web This is the not so easy part because you have to have a place on the web to store the audio file. Luckily, lots of Internet Providers give you free space to do just this kind of thing. There are also incredibly cheap hosting services on the web like "www.1and1.com" that will rent you webspace for literally pennies a day. Check out your current provider to learn about the space they offer and the tools they provide to give you access. Once you have the space, you move your audio file onto the web using something called "FTP" or File Transfer Protocol. Free programs like the one found at "www.smartftp.com" let you do this very easily. Just run the program to set up the connection between your computer and the Internet server that will store your files. Then just point and click to select the desired files to transfer them from your computer to the Internet. Remember to check with your service provider; they may have a free tool available to make this job very, very easy. For the uninitiated, this may sound like a lot but once you do it a few times, the whole process becomes automatic. Just don't fear it; everything will work out fine if you have some patience to learn this. *********************************************************************************************** 4. Playing Audio Via a Link There are a number of ways to play audio on your profile, in a PM or a post. The simplest way is to use the Anchor tag in HTML. Here's the way it's done: < a href='http:// -- your file's location --' >Click here to play my song< /a > The "< a" tag starts the instruction to the browser to do something. The "href" attribute tells the browser to go find a file somewhere on the web and activate it. The "http..." reference gives the location of the file while the " >" character closes the tag. "Click here to play my song" are the underlined words displayed as the link on your page or in your message and "< /a >" is the ending tag telling the browser that this instruction is completed. All you have to do is change the file location and the text you want to display...like this: click here for a BassBoards song The syntax MUST be exact. You MUST type "http://" before your file location and the whole location MUST be enclosed in quotes. You also MUST have some text to display as the link and a "" tag to finish the command. Your typed message will look like this: Hey everyone! To hear our music, click here for a BassBoards song. Thanks. However, your displayed page will look something like this: Hey everyone! To hear our music, click here for a BassBoards song. Thanks. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ The text you placed in the tag will be a different color than the rest of your message and it will be underlined, signifying a link. When clicked, the browser will clear the screen and display that user's default player while automatically playing the file. When done, the user clicks the Back Button to return to your message. This is the LEAST elegant way to play audio but it's simple and it always works. *********************************************************************************************** 5. "Embedded" Audio - The Default Player OK, now that you understand this, I'm going to stop using the words "file location" any more. From now on, the location of your file is its "URL" or Uniform Resourse Locator. Same thing. Another definition: Embed 1. To fix firmly in a surrounding mass: "embed a post in concrete". 2. To enclose snugly or firmly. 3. To cause to be an integral part of a surrounding whole 4. To assign Wolf Blitzer to travel with a military unit during an armed conflict. Woohoo!!! Here comes the good stuff!!! Now you want to use the audio on your profile page in a more elegant way. So what we're going to do is "embed" the audio player right into the page. The easiest way to do this is to let the browser use whatever player has been selected (usually by default) as its audio playback device. This is done using the HTML EMBED tag. Here's the way it's done: <--- you can see the starting tag is closed right here <--- this is the ending tag So an example would be... This works GREAT as a Widget or in your "About Me" box. If you have a problem with the player overflowing its area, adjust the "Width" parameter. Remember to keep "Autostart" and "Loop" set to "false" to let the user determine when he/she wants to hear your audio. It would be interesting, however, to have music or even a spoken welcome message play automatically when your page loads up. This is done by embedding the player AT THE END OF your "My History" section since this is the box that loads first!!! In this case, we want to HIDE the player from view and just run the audio track. Here's the code: <--- you can see the starting tag is closed right here <--- this is the ending tag You can use this in two ways: 1. Set loop="false" to play a welcome message one time; or 1. Set loop='true' to play continuous background music. Gotta warn you that this second option can annoy people when the music is great to you but "grating" to them AND THEY CAN'T SHUT IT OFF because the player is hidden. Viewers will leave your profile quickly if the music is annoying...COUNT ON IT!!! So pick your background music very carefully. And remember, the code goes AT THE END OF your "My History" section. *********************************************************************************************** 6. "Embedded" Audio - Specific Players Sometimes you may want to (need to) use a specific player to handle your audio file. In that case you can embed either Apple's QuickTime or Window's Media Player specifically where you wantthem. Since both use a lot of code, they are NOT recommended for posts or PMs but should only be used in Widgets or in other places on your profile page. Even so, the Windows player is difficult because it approaches the 800-character limit imposed by Eons widgets. And since this is just audio, there is no compelling reason to use either one directly. The code is below in the example section for you to copy and paste if you really want to try these. In reality, the Windows player is used more for displaying video on your page...but that's another topic... *********************************************************************************************** 7. Final Thoughts I've given you a lot of simple but powerful stuff to learn and use. Remember that you can't really screw up. If your widget doesn't work right, you can just delete it. If your audio doesn't play in your "My History" box, just go back into edit mode, delete the code and resave the section. Experiment. Try these methods out and you will find that you'll add some spice to your pages, posts and PMs and have some fun in the process. SPECIAL NOTE: ~~~~~~~~~~~~~ The embed and object commands used to place the audio on your page WILL NOT WORK in the "About ME" section. WILL NOT WORK!!! This is an Eons thing, not the fault of HTML or the player code. One last note on speed... ~~~~~~~~~~~~~~~~~~~~~~~~~ Remember that a lot of people are still using dial-up modems that just can't load tons of information very fast. If you embed a 5MB music file of background music, it will DEFINITELY look like your page is hanging up for those types of users. Please be considerate. A big file should be played at the discretion of the user with your caveat that it may take time to load. Then it becomes their choice to wait or not. Autoplaying large files to dial-up users almost guarantees that they will leave your page very quickly since nothing will be happening during the download. Please consider this fact when you use these audio capabilities. *********************************************************************************************** 7. Updates If people have problems or things change with Eons that affect using this type of code, just write me and I'll work on the issues and post updates as necessary. And give me some feedback on how this is going. JC ================================================================================================= ================================================================================================= SAMPLE HTML AUDIO PLAYER CODE Just copy and paste the code wherever you want it. Test it out, then modify your URL or any other parameters desired. You test out Widgets by installing them and seeing how they work. You test out parts of your profile by editing a section, installing the code and saving it. Then see how the new audio player looks in that section. To test out the code in a post or PM, *** use the PREVIEW feature***!!! Don't send a PM or post until you've previewed it to make sure it works the way you intend it to!!! If there's a problem, edit the PM or post until your Preview shows you what you wanted in the first place. ================================================================================================= ================================================================================================= Play a Song Via a Link: Click here to play the song -------------------------------------------------------------------------------------------------- Using Your Browser's Default Player: Use this one as a Widget, in your "About Me" box or in a post or PM... Use this one AT THE END OF your "My History" box to play background music... Use this one AT THE END OF your "My History" box to play a message... -------------------------------------------------------------------------------------------------- Using Windows Media Player: -------------------------------------------------------------------------------------------------- Using Quicktime Player: