Radio Player Configurator

Live Preview

Custom Player Loading...

Content

Appearance

#FFFFFF
#FFFFFF
#000000
#FFFFFF

Media Settings

Integration Code

Installation Instructions

Both codes below are required for the player to work properly on your website:

  1. Add the HTML code where you want the player to appear
  2. Add the JavaScript code before the </body> tag of your page
Step 1: HTML Code (Place where you want the player) 
<div id="customWebPlayer" playerTitle="Custom Radio Player" playerTitleColor="#FFFFFF" playerSlogan="Radio Player" playerSloganColor="#FFFFFF" playerBGColor="#000000" audioSrc="https://nap.casthost.net/proxy/casthost/stream" coverImageSrc="https://www.casthost.net/images/172407545766c34dc1aeef3.jpg" buttonColors="#FFFFFF"> ...</div>
Step 2: JavaScript Code (Place before </body>) 
<script language="javascript" type="text/javascript" src="https://www.casthost.net/publicCustomPlayer.js"></script>
Complete Example (Complete HTML file) 
<!DOCTYPE html>
<html>
<head>
    <title>My Website with Radio Player</title>
</head>
<body>
    <h1>Welcome to My Website</h1>
    
    <!-- Step 1: Place the radio player here -->
    <div id="customWebPlayer" playerTitle="${playerTitle}" playerTitleColor="${playerTitleColor}" playerSlogan="${playerSlogan}" playerSloganColor="${playerSloganColor}" playerBGColor="${playerBGColor}" audioSrc="${audioSrc}" coverImageSrc="${coverImageSrc}" buttonColors="${buttonColors}">
        Custom Player Loading...
    </div>
    
    <p>Other content on your page...</p>
    
    <!-- Step 2: Add this script before closing body tag -->
    <script language="javascript" type="text/javascript" src="https://www.casthost.net/publicCustomPlayer.js"></script>
</body>
</html>

About the CastHost Web Radio Player

The CastHost web radio player is a modern, responsive, and highly customizable solution for embedding live audio streaming on any website. With its easy-to-use widget, you can provide your visitors with a professional listening experience tailored to your brand and technical needs. Compatible with all modern browsers and optimized for mobile devices, this radio player integrates seamlessly into your site—whether you're a radio station, podcaster, or audio content creator.

Free tool: This radio player configurator is completely free and designed to help you improve your website's SEO.

Advanced Customization: Widget Attribute Explanations

  • playerTitle: The main title displayed on the player. Use this to highlight your station, show, or brand name. A clear title improves recognition and SEO for your radio page.
  • playerTitleColor: Customize the title color to match your branding. Consistent colors reinforce your brand and user experience.
  • playerSlogan: Add a slogan or short description under the main title. This can include a key message, frequency, or marketing tagline to attract visitors.
  • playerSloganColor: Set the slogan color for perfect visual harmony. Good contrast improves readability.
  • playerBGColor: Control the background color of the player for seamless integration with your website, whether light or dark. A suitable background enhances integration and professional perception.
  • audioSrc: Specify the URL of your audio stream (Shoutcast, Icecast, etc.). The player supports both HTTP and HTTPS. Always use secure streams for better SEO and security.
  • coverImageSrc: Add a custom cover image (logo, album art, etc.) for a professional and engaging presentation. Optimized images (square, lightweight) improve load times and user experience.
  • buttonColors: Customize the play/pause button colors to match your color palette. Visible, consistent buttons enhance user interaction.

How It Works

  1. Configure your player: Use the tool above to customize the title, slogan, colors, cover image, and audio source to fit your needs.
  2. Copy the generated code: Grab the HTML and JavaScript code shown in the "Integration Code" section.
  3. Embed on your site: Paste the HTML code where you want the player to appear, and add the JavaScript snippet before your page's </body> tag.
  4. Enjoy streaming: Your custom radio player is now live and ready to stream to your visitors on any device.

Best Practices for Embedding the Radio Player

  • Use HTTPS streams: For maximum compatibility and security, always use HTTPS audio sources.
  • Optimize cover image: Use a square, lightweight, high-quality image for best display on all devices.
  • Accessibility: Add meaningful alt text to your cover image for better accessibility.
  • Test on mobile: Check the player’s appearance and functionality on various devices and browsers.
  • Keep code updated: Always use the latest JavaScript script version for new features and fixes.
  • Brand it your way: Adjust colors and text to match your website’s visual identity.

Why Choose the CastHost Radio Player?

  • Ultra-fast installation: Just copy and paste the HTML code and JavaScript snippet into your site.
  • Fully compatible: Works on all modern browsers (Chrome, Firefox, Safari, Edge) and devices (desktop, mobile, tablet).
  • Responsive design: Automatically adapts to screen size for optimal experience on mobile and desktop.
  • Security: Supports HTTPS streams for secure integration on modern websites.
  • Advanced customization: Change the look and behavior of the player with no coding required.
  • Support & updates: Enjoy responsive technical support and regular updates for compatibility and security.

Whether you're a local radio, an independent podcaster, or a large station, the CastHost radio player lets you broadcast your audio content with ease—delivering a modern, professional user experience.

Frequently Asked Questions

What is the CastHost web radio player?

The CastHost web radio player is a customizable, responsive audio widget that you can embed on any website to stream radio content directly to your visitors.

How do I customize the radio player appearance?

You can customize colors, title, slogan, background, button colors, cover image, and audio source using our easy-to-use configuration tool on this page.

Is the radio player compatible with all browsers?

Yes, our radio player is designed to work across all modern web browsers including Chrome, Firefox, Safari, and Edge, on both desktop and mobile devices.

Can I use HTTPS streams with the radio player?

Absolutely! The player supports both HTTP and HTTPS audio streams, ensuring compatibility with secure websites and meeting modern browser requirements.

How do I integrate the player into my website?

Simply copy the generated HTML code and JavaScript snippet, then paste them into your website's HTML where you want the player to appear.

Is the radio player responsive for mobile devices?

Yes, the player is fully responsive and automatically adapts to different screen sizes, providing an optimal listening experience on smartphones, tablets, and desktops.

Get in Touch
Send us a message
We create hosting and streaming services for companies.

Company

Home About company Pricing Knowledgebase Contact Us

Services

Stream Packages cPanel Hosting Secure Stream URL Mobile App

Follow us