This Article Is For:

• All Users with 'Manage Website' Permissions
• This is applicable to: All Themes

Requirements:

• This is a separately licensed SoCast product.
• If you would like to purchase this skin, please speak with your SoCast Account Manager.
• If you don't see the SoCast Player option available, and you've purchased it, please speak to your Account Manager.

Note: The Radioplayer skin and Music 1.0 skin is not available for multi-tenant clients

Step 1: Add Your Player Stream

1. For instructions on how to add streams please see: Player Streams .

Step 2: Enable the SoCast player

1. Go to Player > Radio Stream Settings > Scroll down to Web Player
2. Using the drop-down menu, select 'SoCast Player'
   
   
3. Then scroll down to the bottom of the page and click Save.

Step 3: Edit The  Player Skin

1. Once you've added your stream, and selected the SoCast Player, you'll see an option on that stream called 'Edit Skin'. Click 'Edit Skin'

Skin Selector

1. Using the skin selector drop-down, select 'Premium 1.0'

Appearance

1. Using the drop-down, select a default font

Player Controls

1. Add a player logo. Dimensions: 220px by 50px. Format: JPG, PNG, GIF. Will use account logo if not provided.
2. Player Control Bar Background Color: Appears behind player controls.
3. Player Controls Color: Used for player control icons.
4. Highlight Color: Used for the background color of the 'Just Played' list header and buttons. Also used for the 'Listen Live' button color when 'Radioplayer' is disabled.

Song Display

1. Enable Song Display: Enabling the 'Song Display' shows the 'Now Playing' song info and artwork below the player controls.
2. Enable Hero Image Animation: Enabling the 'Hero Image Animation' animates the 'Now Playing' song artwork and placeholder images in the hero area.
3. More Songs Link: Links the 'Just Played' list to a page containing the broadcast history widget to show more songs. Pages are configured in Website > Pages.
4. iTunes Affiliate ID: Add an iTunes affiliate ID here so that you get a percentage of sales if users click through and buy singles/albums from iTunes using your site. For more information regarding the iTunes affiliate program, click HERE
5. "Now Playing" Placeholder Image: Dimensions: 1100px by 400px. Format: JPG, PNG, GIF. Appears when no song information is available.
6. Placeholder Background Color: Appears behind the placeholder image and when no image is provided.

Content Area

Configure the appearance of content below the player controls, e.g. activity stream, on air now, weather, event list, contest list, etc. All content layouts are shared between all streams in the account

1. Add Content Layout: Layouts must be published before they can be selected as the active layout displayed in the player.

Footer

1. Footer Background Color: Appears as the background color for your player footer
2. Footer Text Color: Appears as the text color for your player footer
3. Footer Link Color: Appears as the link color for your player footer

Social Icon Links

1. Facebook Link: Add the URL for your Facebook page
2. Twitter Link: Add the URL for your Twitter page
3. Soundcloud Link: Add the URL for your Soundcloud page
4. Youtube Link: Add the URL for your Youtube page
5. Vimeo Link: Add the URL for your Vimeo page
6. Instagram Link: Add the URL for your Instagram account
7. Snapchat Link: Add the URL for your Snapchat account
8. iOS Link: Add the URL for your iOS Store
9. Android Link: Add the URL for your Google Play Store

Page Background

1. Background Image: Dimensions: Max. Size 2560px width. Format: JPG, PNG, GIF. Recommended: Minimum width of 1366px width for a non-repeating centered background (player width is 1100px)
2. Background Repeat: Choose whether to have your player background repeat
3. Background Alignment:  Choose the alignment for your player background
4. Background Color: Appears behind the page background image and when no image is provided.

Custom HTML

1. Header: This section will be inserted just before the closing </head> tag of the page.
2. Footer: This section will be inserted just before the closing </body> tag of the page.