Streaming

Insertar video en vivo en mi web: reproductor de tu canal

Con el menú Reproductores de StreamControl puedes poner tu canal de TV 24/7 o tu canal de video en vivo dentro de tu propio sitio web. Copias un código, lo pegas en tu página y listo: el reproductor se adapta al celular, la tablet y la PC. También tienes un enlace directo para compartir el canal por WhatsApp o redes sociales.

Antes de empezar

  • Entra a https://streaming.webhosting.do/clientes y elige tu canal (TV 24/7 o video en vivo) en el selector de servicios.
  • Necesitas poder editar tu sitio web y pegar código HTML. En WordPress, por ejemplo, se hace con un bloque HTML personalizado.
  • Si tu canal tiene la señal protegida con enlaces firmados, el reproductor también funciona. Lee la nota al final.

Paso 1: abre el menú Reproductores

En el menú superior pulsa Reproductores. Verás el texto: "Copia este código y pégalo en tu sitio web para mostrar tu canal en vivo. El reproductor se adapta al celular, tablet y PC."

Paso 2: elige el tamaño

En Tamaño tienes dos tipos de código:

  • Adaptable (ocupa el ancho disponible): es la opción recomendada. El reproductor toma todo el ancho del espacio donde lo pongas y mantiene la proporción 16:9, tanto en el celular como en una pantalla grande.
  • Tamaño fijo: 640 × 360, 854 × 480 o 1280 × 720. Úsalo solo si tu diseño necesita una medida exacta. Ten en cuenta que en un celular un reproductor de 1280 de ancho puede salirse de la pantalla.

Paso 3: elige el idioma y la reproducción automática

  • Idioma del reproductor: Español o English. Cambia los textos del reproductor, como "En vivo" o "Fuera del aire".
  • Reproducir automáticamente: si lo activas, el video intenta arrancar solo al abrir la página. Los navegadores solo lo permiten si empieza en silencio, así que comenzará sin sonido y el espectador puede activarlo con el botón del altavoz.

Cada vez que cambias una opción, el código y el enlace se actualizan. Si ya habías copiado el código, cópialo de nuevo.

Paso 4: copia el código y pégalo en tu web

  1. En Código para tu sitio web, pulsa el botón de copiar. Verás el aviso Copiado al portapapeles.
  2. Abre el editor de tu sitio web y ve a la página donde quieres el reproductor.
  3. Pega el código en un bloque o sección de HTML.
  4. Guarda y publica la página.

El código adaptable se ve más o menos así (el nombre de tu canal y su dirección cambian):

<div style="position:relative;width:100%;aspect-ratio:16/9;"><iframe src="https://streaming.webhosting.do/embed/tv/tu-canal?lang=es" title="Tu canal" style="position:absolute;inset:0;width:100%;height:100%;border:0;" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen loading="lazy"></iframe></div>

Usa siempre el código que te da el panel, no este ejemplo.

Paso 5: comprueba la vista previa

Más abajo está la Vista previa: es el mismo reproductor que verán tus visitantes. Pulsa el botón de reproducir para comprobar que tu canal se ve bien antes de pegarlo en tu web.

Paso 6: comparte el enlace directo

En Enlace directo tienes la dirección del reproductor a pantalla completa. Cópiala y compártela en WhatsApp, Facebook, Instagram o en un código QR. Quien lo abra verá tu canal sin necesidad de tener una página web.

Tu canal también tiene una página pública: si alguien entra a la dirección pública de tu servicio, el sistema lo lleva a este mismo reproductor. Si quieres una página completa con tu logo, programación y noticias, usa la Mini Web desde el menú Web.

Qué trae el reproductor

El reproductor que pegas en tu web incluye:

  • Botón grande de reproducir y barra con reproducir/pausar, silenciar y volumen.
  • Indicador En vivo o Fuera del aire según el estado del canal.
  • Botón de calidad que empieza en AUTO y, si tu canal tiene varias calidades (ABR), permite elegir una fija pulsándolo.
  • Pantalla completa.

Consejos

  • Pon el reproductor arriba en tu página de inicio: es lo primero que tus visitantes quieren ver.
  • Si activas la reproducción automática, avisa con un texto cerca del reproductor de que deben activar el sonido.
  • Activa calidades ABR en tu canal para que quienes tienen internet lento no se queden congelados.
  • Si cambias el nombre del canal, vuelve a copiar el código para que el título interno del reproductor también cambie.

Problemas frecuentes y soluciones

El reproductor dice "Fuera del aire". El canal no está emitiendo en este momento. Entra a Emisión y revisa que esté iniciado y con programación.

Aparece "La transmisión no está disponible en este momento." El reproductor no pudo cargar la señal. Revisa que el canal esté al aire y recarga la página.

La reproducción automática no arranca. Algunos navegadores bloquean el arranque automático aunque sea en silencio, sobre todo con ahorro de batería. El visitante solo tiene que pulsar reproducir.

El reproductor se sale de la pantalla en el celular. Estás usando un tamaño fijo. Cambia a Adaptable (ocupa el ancho disponible) y pega el código nuevo.

Mi editor de web borra el código. Algunos editores visuales no aceptan iframes en el texto normal. Busca la opción de bloque HTML o código incrustado de tu editor.

Preguntas frecuentes

¿Puedo poner el reproductor en WordPress, Wix u otro constructor?

Sí, en cualquier plataforma que te deje pegar código HTML. En WordPress usa un bloque HTML personalizado.

¿El reproductor funciona en celulares?

Sí. Con la opción Adaptable se ajusta al ancho de la pantalla del celular, la tablet o la PC.

¿Por qué el video empieza sin sonido?

Porque los navegadores solo permiten que un video arranque solo si está silenciado. El espectador lo activa con el botón del altavoz.

¿Funciona si mi señal está protegida con enlaces firmados?

Sí. Cada vez que se abre la página, el reproductor recibe un enlace firmado nuevo, válido por 4 horas. Si alguien deja la página abierta más tiempo y la imagen se detiene, basta con recargarla.

Guías relacionadas