Configuring your player embed

There’s not much point having an online radio station if your listeners can’t hear your stream. That’s where our player embeds come in!

In this guide, we’ll cover the following:

1. A description of each of the players we provide, and
2. A walkthrough of how to configure a player, such that it best suits your station’s website.

By the end, you’ll have a fully functional player, ready for your listeners to press play and hear your station come alive.

The player embeds

We provide more than 10 types of embeds. But in this article, we just going to focus on our 4 player embeds. These are:

1. The inline player,
2. The dock player,
3. The square player, and
4. The popout player.

Each of these players are the same in the core functionality they support i.e. allowing visitors to your website to listen to your stream. Where they differ is their look and feel. So let’s look into each of these players in a little more detail.

The inline player

The inline player is a compact, rectangular widget with a configurable background, a prominent play button, metadata artwork on the left, track details displayed clearly beside it, and room for your station’s socials in the top right hand corner.

The dock player

The dock player is a slim, horizontal bar that tucks itself at the bottom of any page you insert it into. It has a configurable background, a prominent play button, metadata artwork, and track info - all laid out in a compact, always-visible footer interface that lets visitors control your station without scrolling.

The square player

This square player is a compact square widget - think album cover size - with a configurable background, centered play button, visible metadata artwork, and track information displayed beneath. It’s designed to stand alone anywhere on your page and catch the eye without demanding attention.

The popout player

This embed appears as a compact, floating mini-player in its own browser window or tab, featuring a play/pause button, metadata artwork, and track info cleanly laid out. It lets listeners pop the stream out of your page and keep tuning in while browsing or doing other things.

Below the player, it also displays your station’s weekly schedule in a simple, scrollable list, so listeners can easily see what’s playing now and what’s coming up next throughout the week.

Configuring the player embed

We’re now going to walk you through setting up the Inline player for your station.

Though we’re focusing on the Inline player, the below steps are still very useful for configuring the other player embeds. Just note that some of these steps might not apply for the other players.

On your computer, go Radio Cult. Then click the Embeds button in the top navigation bar (Home > Embeds).

You should now be on the Inline player embed page, so let’s discuss the available options to be configured:

• Player display: This setting controls what type of metadata to be displayed on the player embed.
  • Event: This option displays the title of the current show/event and the artwork for any linked artists.

  • Metadata: This option displays the current stream metadata. For example, title, artist and artwork of the current song or live metadata from your live stream client (e.g. BUTT or Audio Hijack).

    Theme: This setting controls the colors of the embed’s background, text and secondary buttons.

  • Dusk: A matte-like dark theme.
  • Midnight: A gloss-like dark theme.
  • Light: A gloss-like white theme.

  • Custom: A custom theme, where colors can be selected for the embed’s background color, primary color, main text color and secondary text color.

    Primary color: This setting controls your player embed’s primary color. Either use the color picker or enter the color’s hex code to set the color for the embed’s primary buttons e.g. play button, volume control etc.

    Corners: This setting defines the corners for the background container element and metadata artwork element of the embed.

  • Sharp: The corners are square.
  • Rounded: The corners are rounded.
• Autoplay on load: If enabled, the player will automatically begin playing once the embed has loaded on your website. If left disabled, a user will have to click the player’s play button to begin listening.
• Remove Radio Cult branding: This option will remove the text: Powered by Radio Cult from your player embed. Note: This option is only available if your Radio Cult plan is premium or business.

Once you have everything configured to your liking, then click the Copy button in the Embed HTML section to copy the iframe   HTML to your device’s clipboard.

You’ll need to take that copied HTML and add it to your website. Unfortunately however, that’s all we can show on our end. We would love to illustrate how to do this, but there’s too many ways to build a website these days. Rest assured, it’s not complicated and all of our embeds work on all websites.

If you do end up getting stuck though, definitely reach out to us! We do know the odd thing about coding.