Player - How To Create And Use Themes

We are currently optimizing the tablet version of our suppport pages. Please visit this page on your desktop to view the correct video


What’s A Custom Theme Builder?

In the Player Suite you will have found out that we have developed this cool theme builder which allows you to create your own personal skin for the advanced player. But some of you are having trouble in getting your own custom theme up and running. You can create some pretty, cool, and great looking custom stuff using this theme builder. In this tutorial I will be walking you through the basics, meaning a Basic Design to help you get the grasp of using the tools, underneath is an overview on how to do this. I will show you my finished player at the below, you will see that I am choosing this player from my player setup, when you save your theme this will automatically set itself in your Advanced Players Theme List.

Starting Your Theme

Okay so first of all we are going to walk through what I class as the first part of the Theme Settings. We will then move on to the second half of the settings. So, “I am confused” I hear you say. Well, simply follow through the options below, these are all the options you can see on the themes page. Next to these boxes I have written some explanations and examples of what should be in them boxes. Once you get onto the actual page you will more than likely find out that the setup is a piece of cake and you will not need this tutorial but just incase we have placed the options below. So, starting from the top here we go –

Theme Name: This is used to give a name to your player, you could name it “Example Player 1” or something more appropriate and profesional like “MyRadioStation.FM”. This is completely up to you but the more you put into this field the more professional you can get the player to look and feel from you, to your valuable listeners.

Album BG Colour: The Album Background Colour is one of the main features to stand out on your player and takes up 30% of your player so the correct colour choice is important. To choose a colour simply click inside the text box and a colour picker will pop up, choose a colour and click the multicoloured circle in the bottom right of the colour picker pop-up.

Album Background Image: If you choose to use one of your own backgrounds instead of the album colour then this could make your player look great, but it could also make it look a little off putting so selecting the right image is vital. Remember this takes up 30% of your player so getting this right is crucial. Just click the “Upload” button, find your background which matches the requirements and then click “Upload”. You will see your image on the player at the top of the page. Make sure you get the credentials correct if you are using an image! (135x135px)(1MB).

Finishing Your Theme

Continue filling out the boxes down the page to customise your player. Below describes the option you can choose from –

Main Background Colour Image: This section is probably the most noticeable and will make or break your player into a professional looking player or an average looking standard player. If it’s looking standard why don’t you try out our advanced player skins which have loads of professional looking themes. If you want a solid colour then remember, simply click inside the text box and a colour picker will pop-up choose a colour and click the multi-coloured circle in the bottom right of the colour picker pop-up. If you want to use the image uploader please remember that this takes up 70% of your player and will be the most noticeable; to do this just click the “Upload” button and find your background which matches the requirements then click “Upload”.

Button Style Button Colour: This is the option where you style your button. This button is the “Play/Stop” button that goes in the middle of your player. We have style and cooler options for you, we have Circle, Square, and Rounded (rounded square). Just click the arrow and select a shape, then when this is selected choose a colour. Think of the information above and try match up so your two colours go together and look cool!

Time Text Colour: This lets your user know how long they have been tuned in, this needs to be a different colour to the time background or you will not be able to see it.

Time Background: This is the background that the player button and the player time will be on, so make sure that this colour contrasts with the other two options.