Embedding Audio In a Blogger Post Using Sound Manager 2

This originally started as a test post, when I was trying to figure out a slick way to embed audio files in a Blogger post, with nice inline play controls. Sound Manager 2 is a great Flash/HTML5 hybrid audio player that just "does the right thing" depending on the visitor's browser, and offers lots of widgets for hosting audio files, so I settled on this as my player. I realized that others were also trying to figure out how to do this, so I'm cleaning up this post and leaving it up as a tutorial.

I'm going to show demos of the four "widgets" currently available as part of Sound Manager 2: the "360 UI", the "inline player", the "page player", and the "button player". The javascript and css files are hosted in a directory at my own Web page, and I'm pointing specifically to the "cross-domain" version of the swf file. You're free to use the URLs that I use in my demo, i.e. to link to the directory where I host the javascript, css, and swf files, but don't sue me if someday I move them. There's nothing magic about where I'm hosting them. Note that I have slightly customized the css for the individual players, i.e. the directory is not *exactly* just an unzipping of Sound Manager 2. But I haven't done anything special to make it work, other than unzipping the "cross-domain" version of the swf file.

So, game on, here are the four widgets:

The 360 player

Unusually Blue Bluebird

The inline player

• There's Nobody Home
• Dan’s Not Here

The page player

• Do You Want to Leave a Message?
• The Single-Camera Blues

The button player

[mp3] Knockin' on Heaven's Door

I'm also linking off to a text file that contains exactly the content of my blogger editor view, and an html file that does all of this in a standalone test page.

Happy playing!