About me

I'm a geek working as a distance learning specialist for a large corporation.

My Pandora "radio station" profile
This is my favorite way to listen to music now.

My Yahoo "radio station"
(Unfortunately, only works in IE.)

Shopping

Looking to purchase something online? Support Caddickisms by going through one of these links:

Caddickisms Store

Amazon.com

Calendar

January 2007
S M T W T F S
« Dec   Feb »
 123456
78910111213
14151617181920
21222324252627
28293031  

Topics

Posts by month

Around the site

My wife's opinion differed a bit from mine (as usual... ;) ). Like me, she wanted to know more about what he was like after beating the addiction. The textReview: Ray (another perspective)

Easy Meal Prep Association and Meal Assembly Directory I'm looking for ways to live cheaper. I got a tip in the comments of another blog to check out a Meal PreparatoryIs a meal preparation service a good deal?

Yesterday I read an article in the ZDNet Tech Broiler attempting to make the case for the studios to release first-run movies direct to streaming options (specifically Netflix and iTunes).Movie Theater vs. Home Theater (part 1)

Learning 2006 - Josh Bersin & Elliott Masie Dialogue Josh and Elliot, two "thought leaders" in the learning industry, get together and talk about the things they're seeing in the learningElliott Masie & Josh Bersin: Learning Trends

There's really nothing I can add to this, so without further ado... Star Wars on BanjoStar Wars Bluegrass

Yeah, I got this from a chain mail, but it's the first one to make me laugh out loud in a few years, so here you go...   A Lawyer and aHow to make $490

When I went to college, I hung out with a bunch of music majors. I also hung out with a bunch of geeks. Sometimes those were the same people. IDrinking games for geeky music majors - Tuesday TubeWatch

John Williams is probably the most well known film composer in history. He owes much of that success to the Star Wars series, but Jaws, Superman, Close Encounters of thePre-prequel-era Star Wars music tribute

The Wachowski brothers have a firm grasp of visuals and a healthy respect for graphic novels. They also know how to write a script that challenges the viewer's perceptions ofReview: V for Vendetta

Oh, great... another cause to spend our research money on. Duke Nukem Disease: Come Get Some! - Tuesday TubeWatch

(Okay, there is a lot of YouTube in this post. I got a little carried away. If you're not seeing it 'cause your IT department is lame, come back whenMTV Yearbook - where does it take you?

Another year has gone by, and more fathering lessons have been learned. Hopefully my kids have learned a bit, too. For my part, I've learned - perhaps more than in otherHappy Fathers Day

My wife cheats. There is no way she's done this without cheating. See, it started out innocently enough. She started putting up cute little statuses on Facebook about the things our kidsCheater!

People need to learn how to drive. I was in a traffic jam this morning in the right lane of the highway. Dead stop. I was not happy. Meanwhile, in the leftTraffic jams

Magneto, Professor X, Mystique, Beast, Banshee, Darwin, Angel, Emma Frost, Havoc, Azazel, Sebastian Shaw, and... um... tornado dude. That's a lot of characters to pull together in one movie. They didReview: X-Men: First Class

Making MP3s playable on a website, the easy way

[update: I've since started using the Anarchy plugin, which also makes standard hyperlinks playable, and though I'm on the fence about which technology I like better for audio (I got Anarchy for the video component), I lean toward the method described below because it's less visually intrusive. Unfortunately, I can't figure out how to disable the Anarchy audio player segment without disabling the whole thing, so all the example links below (and throughout this site for now) show Anarchy's "audio mp3" indicator beside the simple blue arrow used by the del.icio.us player described below. The blue arrow is the only thing installed by the instructions below (visually) so keep that in mind as you continue reading.] 

I’ve been looking for something like this for months. Who knew I’d find it without even trying on one of the most popular websites in the world?

A while back, I was working on some podcasting ideas for work and testing some things out here on Caddickisms. I spent a long time just trying to get an audio player to work correctly in WordPress (the software that runs this blog). The problem is that everything I found used the HTML <object> tag, which WordPress kept re-writing (and breaking) behind the scenes. I thought I had it fixed when I ran across the Gmail audio player, which uses the <iframe> tag, but apparently something gets screwed up there too, because while it works in Firefox, it’s broken in Internet Explorer (at least in version 6).

So… I gave up. I’m still working on Podcasting related stuff at work, but it’s not posted in a blog, so there was no reason to try to fix something I wasn’t going to be doing very often, if at all. But it kept gnawing at me…

Today, I finally found something that works and it’s easier than any other method I’ve found.

Here’s what you need to know:

  1. Copy this [updated. See comments]: <script type="text/javascript" src="http://images.del.icio.us/static/js/playtagger.js" ></script>
  2. Put it somewhere in your HTML.
  3. Put up a standard link to an MP3 file.

That’s it.

On a blog, you might think you’d have to put the HTML into a template page. You could do that, but with WordPress’ Sidebar Widgets, you don’t have to! Just use one of your existing Text Widgets and put the code in there. I put mine in the “About Me” widget. Works great! Now anytime I want to link to an MP3 file, visitors can play it directly from my page!

Here are some examples:

Grey Eye Glances: Close Your Eyes

Grey Eye Glances: If I was…

(for more of this type of music, try out the Grey Eye Glances site.)

[tags]website MP3 player, javascript tricks and tips, WordPress tips, del.icio.us tools, play tagger, Grey Eye Glances[/tags]

Tags: , , , , , ,

15 comments to Making MP3s playable on a website, the easy way

Leave a Reply

  

  

  

You can use these HTML tags

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CommentLuv badge