Configurador de Reproductor de Radio

Vista Previa en Vivo

Custom Player Loading...

Contenido

Apariencia

#FFFFFF
#FFFFFF
#000000
#FFFFFF

Configuración de Medios

Código de Integración

Instrucciones de instalación

Ambos códigos a continuación son necesarios para que el reproductor funcione correctamente en su sitio web:

  1. Agregue el código HTML donde quiera que aparezca el reproductor
  2. Agregue el código JavaScript antes de la etiqueta </body> de su página
Paso 1: Código HTML (Coloque donde quiera el reproductor)
<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>
Paso 2: Código JavaScript (Coloque antes de </body>)
<script language="javascript" type="text/javascript" src="https://www.casthost.net/publicCustomPlayer.js"></script>
Ejemplo Completo (Archivo HTML completo)
<!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>

Acerca del reproductor de radio web de CastHost

El reproductor de radio web de CastHost es una solución moderna, adaptable y altamente personalizable para integrar streaming de audio en cualquier sitio web. Con su widget fácil de usar, puedes ofrecer a tus visitantes una experiencia auditiva profesional, adaptada a tu marca y necesidades técnicas. Compatible con todos los navegadores modernos y optimizado para dispositivos móviles, este reproductor se integra perfectamente en tu sitio, ya seas una emisora de radio, podcaster o creador de contenido de audio.

Herramienta gratuita: Este configurador de reproductor de radio es completamente gratuito y está diseñado para ayudarte a mejorar el SEO de tu sitio web.

Personalización avanzada: Explicación de los atributos del widget

  • playerTitle: El título principal que se muestra en el reproductor. Úsalo para destacar el nombre de tu emisora, programa o marca. Un título claro mejora el reconocimiento y el SEO de tu página.
  • playerTitleColor: Personaliza el color del título para que coincida con tu identidad visual. Los colores coherentes refuerzan la marca et la experiencia del usuario.
  • playerSlogan: Añade un eslogan o breve descripción bajo el título principal. Puedes incluir un mensaje clave, frecuencia o frase de marketing para captar la atención.
  • playerSloganColor: Define el color del eslogan para lograr una armonía visual perfecta. Un buen contraste mejora la legibilidad.
  • playerBGColor: Controla el color de fondo del reproductor para integrarlo perfectamente en tu sitio web, ya sea claro u oscuro. Un fondo adecuado mejora la integración y la percepción profesional.
  • audioSrc: Especifica la URL de tu flujo de audio (Shoutcast, Icecast, etc.). El reproductor admite HTTP y HTTPS. Usa siempre streams seguros para mejor SEO y seguridad.
  • coverImageSrc: Añade una imagen de portada personalizada (logo, carátula de álbum, etc.) para una presentación profesional y atractiva. Imágenes optimizadas mejoran la carga et la experiencia.
  • buttonColors: Personaliza el color de los botones de reproducción/pausa para que coincidan con tu paleta de colores. Botones visibles y coherentes mejoran la interacción.

¿Cómo funciona?

  1. Configura tu reproductor: Usa la herramienta de arriba para personalizar el título, el eslogan, los colores, la imagen de portada y la fuente de audio según tus necesidades.
  2. Copia el código generado: Obtén el código HTML y el script JavaScript que aparecen en la sección "Código de Integración".
  3. Intégralo en tu sitio: Pega el código HTML donde quieras que aparezca el reproductor et añade el script JavaScript antes de la etiqueta </body>.
  4. Disfruta de la transmisión: Tu reproductor personalizado ya está en línea y listo para transmitir a tus visitantes en cualquier dispositivo.

Mejores prácticas para integrar el reproductor de radio

  • Usa streams HTTPS: Para máxima compatibilidad et seguridad, utiliza fuentes de audio HTTPS.
  • Optimiza la imagen de portada: Elige una imagen cuadrada, liviana y de alta calidad para que se vea bien en todos los dispositivos.
  • Accesibilidad: Añade texto alternativo relevante a la imagen de portada para mejorar la accesibilidad.
  • Prueba en móvil: Verifica la apariencia et funcionalidad del reproductor en diferentes dispositivos y navigateurs.
  • Mantén el código actualizado: Usa siempre la última versión del script JavaScript pour profiter de nouvelles fonctionnalités et corrections.
  • Personaliza para tu marca: Ajusta los colores y textos para que coincidan con la identidad visual de tu sitio.

¿Por qué elegir el reproductor de radio de CastHost?

  • Instalación ultrarrápida: Solo copia y pega el código HTML y el script JavaScript en tu sitio.
  • Totalmente compatible: Funciona en todos los navegadores modernos (Chrome, Firefox, Safari, Edge) y dispositivos (PC, móvil, tablet).
  • Diseño adaptable: Se ajusta automáticamente al tamaño de pantalla para una experiencia óptima en móvil y escritorio.
  • Seguridad: Soporte para flujos HTTPS para integración segura en sitios web modernos.
  • Personalización avanzada: Modifica la apariencia y el comportamiento del reproductor sin necesidad de conocimientos de programación.
  • Soporte y actualizaciones: Disfruta de soporte técnico receptivo y actualizaciones regulares pour garantir compatibilidad y seguridad.

Ya seas una radio local, un podcaster independiente o una gran emisora, el reproductor de radio de CastHost te permite transmitir tu contenido de audio fácilmente, ofreciendo una experiencia moderna y profesional.

Preguntas Frecuentes

¿Qué es el reproductor de radio web de CastHost?

El reproductor de radio web de CastHost es un widget de audio personalizable y responsivo que puedes integrar en cualquier sitio web para transmitir contenido de radio directamente a tus visitantes.

¿Cómo puedo personalizar la apariencia del reproductor de radio?

Puedes personalizar colores, título, eslogan, fondo, colores de botones, imagen de portada y fuente de audio usando nuestra herramienta de configuración fácil de usar en cette página.

¿Es el reproductor de radio compatible con todos los navegadores?

Sí, nuestro reproductor de radio está diseñado para funcionar en todos los navegadores web modernos incluyendo Chrome, Firefox, Safari y Edge, en escritorio y móvil.

¿Puedo usar transmisiones HTTPS con el reproductor de radio?

¡Absolutamente! El reproductor soporta transmisiones de audio HTTP y HTTPS, asegurando compatibilidad con sitios seguros y cumpliendo los requisitos de navegadores modernos.

¿Cómo integro el reproductor en mi sitio web?

Simplemente copia el código HTML generado y el fragmento de JavaScript, luego pégalos en el HTML de tu sitio web donde quieras que aparezca el reproductor.

¿Es el reproductor de radio responsivo para dispositivos móviles?

Sí, el reproductor es completamente responsivo y se adapta automáticamente a diferentes tamaños de pantalla, proporcionando une expérience de escucha óptima en smartphones, tablettes y escritorios.

Ponte en contacto
Envíanos un mensaje