Stratus – a horizontal player for your website or blog

Stratus – a horizontal player for your website or blog

Attention! Stratus has been updated to 2.0. Learn more about it here!

“A stratus cloud is a cloud belonging to a class characterized by horizontal layering with a uniform base…” – Wikipedia

(Finally.. an opportunity to use a “cloud” reference in one of my open source apps.)

Stratus is a jQuery powered SoundCloud player that lives at the bottom (or top) of your website or blog and enables visitors to listen to SoundCloud tracks & sets. The best way to explain how Stratus works is to simply see it in action. Head over to stratus.heroku.com or just click play on the video below:

Simple and effective. So what makes Stratus so special? Three things:


1. Installation

Installing Stratus on your website or blog is as easy as including a stylesheet and a few javascript files. Check stratus.heroku.com for the bits of code you’ll need to add, as well as Tumblr and Ning specific instructions. (WordPress incoming)

2. Customization

Stratus has a slew of built in customization options that range from whether it auto plays to if it appears at the top or bottom of the page. Refer to the chart on stratus.heroku.com to see all configuration options.

Also, since Stratus is constructed in HTML and CSS you can completely customize the look of it. I’d suggest looking at the outputted source code for starts. And for those of you who are really adventurous, you’ll find the source SCSS here. Just include your adjustments after the included stratus.css stylesheet.

3. Accessibility

In addition to SoundCloud track and set urls, Stratus can also play links to user accounts and favorites. Simply include the appropriate links in your installation: soundcloud.com/leemartin, soundcloud.com/matas/favorites.

Finally, the player is smart enough to know your browser/os environment and choose the best playback for each. Which means it works well on iPhones and iPads. Yay for universal accessibility!


Stratus is already being used by some great websites and blogs like seamsmusic.com. If you have one to add to the list, a suggestion, or a bug, please send me an email or contact me on Twitter @leemartin.

I really hope you guys enjoy this one. Happy Holidays!

P.S. Special thanks goes out to Matas Petrikas for his work on our custom player library and Bear Bibeault & Yehuda Katz for jQuery in Action, Second Edition. Both of which were crucial in the creation of this player.

We use cookies for various purposes including analytics and personalized marketing. By continuing to use the service, you agree to our use of cookies as described in the Cookie Policy.

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close