Once you've heard that you're live on the platform, congratulations! There's one final thing we need all stations to do.

By joining Radioplayer, you have become part of a family of over 500 stations. We'd like you to participate in the community and the most important way is to link to your web console from your homepage. We believe it's so important, we ask all stations to do this, as part of our community rules.


Radioplayer launcher buttons allow you to easily add buttons to your site that launch the web player in the correct sized window, and ensure that the player URL is always correct. The buttons can be easily customised to match your branding, and can automatically load station logos. 


Your web player should open at 960 pixels wide by 700 pixels high. 


Integrating the launcher button

First, you need to link the player scripts and stylesheet in the <head> of your page:

<script
    type="module"
    src="https://assets.player.radio/latest/buttons.js"
></script>
<script
    nomodule
    defer
    src="https://assets.player.radio/latest/buttons.legacy.js"
></script>
<link rel="stylesheet" href="https://assets.player.radio/latest/buttons.css" />


Styles


Make sure you replace the RPID with your station's own RPID. You can find a station's unique RPID next to the station's name under 'My Stations' in the Station Control Panel


You can select which style of button you want to display by adjusting the shape, size and theme.

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1"
        }
    </script>
</div>

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "shape": "ROUNDED"
        }
    </script>
</div>

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "shape": "ROUNDED",
            "size": "SMALL"
        }
    </script>
</div>

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "shape": "ROUNDED",
            "size": "SMALL"
        }
    </script>
</div>

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "theme": "LIGHT"
        }
    </script>
</div>

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "theme": "DARK"
        }
    </script>
</div>

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "theme": "DARK",
            "customColour": "#832E82"
        }
    </script>
</div>


Logos

You can include your station logo in the button as well. The logo you have set in the station list manager is the logo that will be displayed in the player and the button. The button will automatically update with the correct logo if you change your logo in the station settings. 

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "theme": "LIGHT",
            "showLogo": true
        }
    </script>
</div>

You can also choose to override the default station logo and add a custom image to the button. 

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "shape": "ROUNDED",
            "theme": "DARK",
            "showLogo": true,
            "overrideLogo": "//placekitten.com/100/45"
        }
    </script>
</div>

Text

The default text is "Listen Now", but this change be changed to display a custom message.

<div data-radioplayer-button>
    <script type="application/json">
        {
            "rpId": "1",
            "labelText": "Listen Live"
        }
    </script>
</div>


Have your web developer paste the selected code into the navigation of your site or somewhere prominent elsewhere on the homepage.


Other resources

Radioplayer isn't just available in smartphone apps and on the web. We also have a presence in cars, on the Kindle Fire and some home hardware devices. It can sometimes take a few weeks to appear in all our locations but availability on the web and in mobile apps is always the priority. To ensure you're available as widely as possible, we recommend ensuring your station profile is up-to-date and as complete as you can make it.

If you're using Myriad, you can now link it to Radioplayer and have it push live realtime Now Playing information to us. Aiir has a similar capability.

Do you have podcasts, catch-up or other listen-again content? So long as you've got the rights to distribute it, you can put it on Radioplayer. We need a podcast-compatible RSS feed and that's it. Find out more here.