Start - Quick Start Guide: Advanced Player and Facebook

Advanced Player

Turbo charge your radio station with viral Facebook distribution, multi-device support, and much more! This new radio player duo is the future of online radio with the highly customisable skins plus a range of professional skins available, multiple customisable features, and colour schemes to click through. This article will help get you up and running, and buy the end you will have a customised player that can be shared with all your listeners.

You will first need to login to your Wavepanel Account, then go to Players. This will automatically land you on the Advanced Players page. Simply click Create New.

There are quite a few options to fill out so in this section we will walk through the first half to the options. So once you are on the “create new player” page, you will be faced with the following options (which are in bold). There is example information, to illustrate what needs to be there, but you will need to use information about your station.


If you have a server from us, you can just select it from the dropdown menu, and this will automatically fill in the details. If not, we will guide you through the fields here:

Name: Player One – This can be anything you like to recognise the player when choosing or editing it.

Host: – This is your hostname you were given by Wavestreaming or your SHOUTcast provider. This can also be an IP address. Remember do not include ‘http://’

Port:1234 – This was also given to you by Wavestreaming or your SHOUTcast host. This will be commonly four numbers, in some cases this could be five numbers.

Type: Choose a server type. This will be either SHOUTcast V1, V2, or Icecast V2. All SHOUTcast servers from Wavestreaming are V2.

Stream ID: If you choose SHOUTcast V2, then you will need to enter this field. If you are with Wavestreaming, then this will default at one, this is your best option. If this doesn’t work, contact your SHOUTcast host and ask them about your Stream ID.

Theme: Choose a theme. We have many default themes made for you. If you have generated your own theme then this will be in here too.

Theme Options: These options add extra features to your player, see below for the list of options.

Show Image: This will show the album art on the left side of your player.

Show Info: This will show the track title and play/pause button on hte riht hand side of the player.

Show Pop Out: This will show an option to have the player pop out in a separate window, for people who want to move away from your website but keep on listening.

Show Volume Slider: This will show a volume slider, this will help listeners adjust the volume on your player.

Start Playing When Page Loads: This will start your player when your listener loads your page.

Finishing Off Your Settings

So we have just a few options left, these options are for visual purposes. The hard bits are done and we can concentrate on finishing your HTML5 Advanced PLayer! So I have set out these options the same as above to help you flick through them. Again, it will look a little different to what you will be typing in as you will have different details to what is shown in the example, but you should follow the same pattern.

Artist Title: For example “My Radio FM” – This will show when the player cannot get your streaming details. So maybe a good idea to get your station name on there.

Track Title: For example “Great Music & Sport 24/7″ – A great way to describe your station, add a slogan, or even place your website address.

Default Album Art: I suggest uploading your station logo, create something cool! Remember the dimensions (115px vs 115px) and the size (1MB).

Always Display This Image: Now the art above will show when the player cannot find your album art. If you want your logo there 24/7 then click this box!

Player Website: You can limit your player to only play on your site, but if you are spreading your player around multiple sites then leave this field blank

Our advanced player has lots of amazing features, not least of all it’s ability to be integrated to Facebook.

First, if you haven’t already, you need to set up a Facebook page for your station. This is different from a profile, and there is a guide to do this here.

Then you need to log into your Wavepanel and go to Players. You should have an Advanced Player section. When you go into this, you should see something like the below:

Click on the Facebook icon. You will be taken to this page.

img5-large-advancedfb (1)

First you need to click where it says ‘Click Here’. This will take you to Facebook, where you can install the Wavestreaming App on your page. Once this is done you will need to come back to this page. You then need to copy the long Player ID (highlight then Ctrl/cmd + c).

Go back to your Facebook page where you app is installed. Click on the app, which will be in the top right hand corner, underneath your Facebook Cover Photo (you may need to click on More, then Wavestreaming Player). You will be taken to a page that looks like this. Paste the code (Ctrl/cmd + v) into this box and click Set Player.

And its as easy as that!