Every Libsyn podcast show comes with an HTML5 media player. This media player will play audio and video, and includes three different skins to fit your needs. In this tutorial, we are going to walk through configuring the media player for your show.
Configuring the Show Player
To get started, log into your Libsyn Dashboard and go to . A list of your available destinations will open. Click on Edit next to the media player destination:
The destination page will open with the options available for working with the media player.
The top of the page offers you the ability to change the destination name. This can be ignored in most cases. This allows you to customize the name of the player as it appears in your destinations list in the dashboard, it is not seen anywhere else. This is useful if you have more than one player destination (for Pro customers).
The legacy player is our earlier HTML5 player option. The Standard player is a more sleak, updated html5 player compatible with video. The Standard Mini is a smaller player solution for those who just want a small audio player.
The custom player provides the ability for you to select the color of the player, add or remove a playlist, and will work for video and audio.
The minimum sizes (for the legacy and standard players) that can be used and include all features is 600 pixels wide and 500 pixels high.
Note: These are the absolute minimum size requirements associated with the player.
- For the Legacy Player: The player must be 200px wide and 75px high at minimum.
- For the Standard Player: The player must be 200px wide and 45px high at minimum.
- For the Standard Mini: The player must be 200px wide and 26px high at minimum.
- For the Custom Player (without playlist): The player must be 450px wide and 90px high at minimum.
- For the Custom Player (with playlist): The player must be 450px wide and 250px high at minimum.
Speaking of size, the next section on this page lets you set the size you want the player to be:
Use Thumbnail: If you upload episode thumbnails for your episodes, those thumbnails can display in the player (provided the minimum size requirement is met). Details on images can be found by clicking here.
Automatically Start Player Once it Loads: Checking this box will allow the player to autoplay on page load.
Playback Direction: This determines if episodes are played newest to oldest or oldest to newest.
Your player is now configured. Hit the button to preview the player settings you have set, then hit to save your changes.
Additional Options for the Custom Player
The custom player offers a few additional settings than the other player options offer.
Render Playlist: Checking this box on will allow the player to include a playlist. In order to use the playlist with the player, the player must also be configured to be 250px in height. The player including the playlist will look like this:
Custom Color: The custom player allows you customize the color of the play buttons, timer, forward and back buttons, as well as the links and buttons in the playlist to a color that fits your design requirements.
Embedding the Show Player
Now that your player is configured, you probably want to embed it somewhere! We make this easy, straight from the destinations page:
Hitting the Get Embed Code button will open a popup which displays the embed code you can copy and paste into your site as you wish. It also includes a preview of the player:
Embedding the Episode Player
The show player will start at the newest episode playing to oldest, or vice versa. However, we also offer an episode specific player that will play that specific episode. This is great for episode posts on blog pages, or even for handing to interview guests so they can embed on their own site.
To grab the episode player embed code, go under Content –> Previously Published:
Each episode will have a LINK/EMBED button.
A window will pop up with the player options toward the bottom.
By default, the episode player will pull the settings from the show player destination. However, you can change and modify them here as you wish. Once done, hit Preview/Get Embed Code to see the player as configured, and grab the embed code.
Have additional questions? Contact our support team at email@example.com.
← Knowledge Base