Automatically Convert MP3 links to Audio Players

• Tweet

Yahoo have a nice little snippet of Javascript that will convert all MP3 (and some other) links on your web page into functional flash MP3 players. I’ve sourced some JavaScript code from Google Pages that will do precisely the same thing… but instead of rendering a large player on your screen, it takes the minimalistic approach and simply creates a play/stop button to the left hand side of an active MP3 link.

About a week ago I sent out an email to the mailing list with an enhanced version of what I’m describing below… giving users the option of player, a download link and so on. If you’re interested in the enhanced code, please let me know.

To clarify the functionality described above, the html text of:

The <a href="file-1.mp3">quick</a> brown fox <a href="file-2.mp3">jumped</a> over the <a href="file-3.mp3">lazy</a> dog.

… will be converted into:

This code will work with MP3 links created using either the visual or ‘rich’ editor in WordPress (or most other platforms). Since the JavaScript parses all MP3 links it’s best to only use this script if you’re not already using a dedicated player.

You have two options to get this cool functionality to work.

1. One single line of JavaScript (with Internoetics serving code)
2. Integrating the code into your own website or WordPress blog

By far, the easiest method of implementing this MP3 player-converter into your basic (non WP) site is with this single line of JavaScript code in the head of your HTML page:

That’s it! All your MP3 files will now be converted into a functional audio player.

If you’re using WordPress you will have to include the JavaScript file in the head of your document by using following code. Copy it into your theme’s functions.php file.

function link_player_head() {
	echo "<script type=\"text/javascript\" src=\"http://www.internoetics.com.com/audio-players/link/player.js\"></script>\n";
}
add_action('wp_head','link_player_head');

Internoetics will serve the JS file and images. When users hit play there will be a tiny little icon linking back to this post. The downloaded package includes no branding. If you’re going to use the packaged code on your WordPress site you will have to edit the player.js file so that all URL’s point to your own server.

I personally wouldn’t use this for anything other than small files… and only if you don’t use audio files often. After all, it only renders a play and stop button. If you use lots of audio, you’re probably best using a more robust/customizable/scalable audio solution.

First Name: Your Email Address:

If you liked this article, you may also like:

1. WordPress Audio Player and Shortcode
2. Flash MP3 Players and WordPress
3. HTML5 Audio and Video
4. Create a WordPress Author Bio with Custom Social Links
5. Convert Currency on your Website or in a WordPress Post (with Shortcode)