A lot of Options

You can customize the player with a lot of options, so the player behaves like you want. Show or hide most elements.

Shortcuts

You can control the player with your keyboard. Togglespace, Previous:, Next:, Volume up:, Volume down:.

Responsive

The player is designed for any kind of device - mobile and desktop. Sound Space fits its layout to the device screen.

Unlimited colors

You can easily change the colors of the player via the module parameters to create an individual skin.

soundspace pop

Sound Space

Written by Pixel Point Creative.

Sound Space is a responsive, jQuery music player with loads of options. You can customize just about everything. This audio player is supported by all major browsers (Firefox, Chrome, Safari, IE7+, Opera etc.) and mobile devices like iPhone, iPad, Android etc. You can add self-hosted MP3 files and tracks from SoundCloud very easily.

Sound Space is included for FREE with Vibe. You can also purchase it separately HERE.

Features

  • Responsive Player
  • Keyboard shortcuts
  • Fully customizable colors
  • Top or Bottom positioning 
  • Stream from folder or SoundCloud
  • Social Networking Links (SoundCloud, Twitter and Facebook)
  • Playlist
  • Random
  • Shuffle
  • Progress Bar and Track Timer
  • Cover Art
  • Show player at start
  • Customize the location of the trigger
  • Lots more.

How to set a link to play a track

You can also link to the player from within the content by using a special CSS class: "fap-single-track"
Here is some example code:

<a class="fap-single-track" href="http://soundcloud.com/infectiousmusicuk/sweet-disposition-by-the-temper-trap">The Temper Trap - Sweet Disposition</a>

This code outputs this link: The Temper Trap - Sweet Disposition

If you are linking to a track on SoundCloud, it will automatically include a title. If you link to a local file, make sure to add a title so the player knows what song is what. Like this:

<a class="fap-single-track" href="/vibe/media/loco.mp3" rel="http://pixelpointplayground.com/vibe/images/covers/311.jpg" title="311-Loco" >311 - Loco</a>

This code outputs this link: 311 - Loco

How to add cover art for local mp3s

In the file description box, you can use 4 parameters for your local mp3s. They are:

  • title
  • description
  • cover
  • target


Here is a complete example with 2 tracks added. You can add as many as you want, each on a new line.

trackname.mp3::url=http://www.yoururlhere.com&title=Artist Title&desc=Track Title&cover=http://yoururlhere.com/images/covers/albumcover.jpg&target=_blank

trackname2.mp3::url=http://www.yoururlhere.com&title=Artist2 Title&desc=Track2 Title&cover=http://yoururlhere.com/images/covers/albumcover2.jpg&target=_self