Incrustar audio en su sitio

  • Actualizado el 4 de septiembre de 2024
  • Publicado el Jul 3, 2024
  • 3 minuto(s) de lectura
Anterior Siguiente

Siga estas instrucciones para incrustar un reproductor para su podcast en su sitio web.

Omny Studio genera dos tipos de reproductores para su audio: reproductores incrustados de clip único y reproductores incrustados de listas de reproducción.

Para encontrar el código HTML de estos reproductores, haga clic en el clip o lista de reproducción que desea compartir y vaya a "Detalles". Seleccione la pestaña "Incrustar" y elija qué reproductor incrustado desea usar.

Insertar estilos de reproductor

Omny Studio tiene varias opciones de estilo y tamaño de reproductor incrustado:

  • Reproductor de ilustraciones anchas: el reproductor adapta el ancho al contenedor, mide 180px de alto, muestra la ilustración en el lateral y adapta el color de fondo con una ilustración borrosa.

  • Reproductor de color ancho: el reproductor adapta el ancho al contenedor, mide 180px de alto, muestra la ilustración en el lateral y tiene un color de fondo sólido.

  • Reproductor grande: el reproductor se establece en un tamaño fijo y muestra la ilustración completa como fondo. Está disponible en varios tamaños preestablecidos (400×400, 300×300, 560×315).

  • Reproductor de transcripciones: el reproductor se adapta al ancho del contenedor, mide 600px de alto, muestra la transcripción publicada con resaltado interactivo y haga clic en la palabra a buscar.

Nota: el HTML del iframe del reproductor incrustado se puede ajustar manualmente para otras opciones de tamaño, pero algunos tamaños pueden no ser apropiados para la opción de estilo.

Opciones de reproductor incrustado

Los reproductores incrustados se pueden personalizar individualmente o las opciones se pueden establecer como valores predeterminados para toda una organización, red o programa.

  • Mostrar ilustraciones: muestra u oculta la ilustración del clip.

  • Mostrar compartir: muestra u oculta el botón de compartir y la funcionalidad.

  • Mostrar descarga: muestra u oculta el botón "Descargar" en la pantalla de compartir.

  • Mostrar descripción: muestra u oculta el botón "Información" y la descripción del clip.

  • Mostrar suscripción al podcast: muestra u oculta el botón "Suscribirse".

  • Colores personalizados: anule los colores de resaltado del reproductor incrustado (que se muestran en el botón de reproducción y en la sección de reproducción de forma de onda), el color de fondo (solo aplicable al estilo ancho) y el color del texto (solo aplicable al estilo ancho).

Funcionalidad avanzada de reproductor incrustado

Los reproductores incrustados también se pueden ajustar manualmente para habilitar más funcionalidades. Esto se puede hacer editando el src del código HTML incrustado para incluir parámetros de consulta adicionales. Por ejemplo, reproducir la incrustación de 1 minutos y 5 segundos implicaría cambiar el iframe src De:

src="https://omny.fm/shows/show-slug/clip-slug/embed"

Para:

src="https://omny.fm/shows/show-slug/clip-slug/embed?t=1m05s"

Si habilita varias opciones avanzadas, combínelas con ampersand (&). Por ejemplo, reproducir la incrustación de 1 minutos y 5 segundos con la reproducción automática habilitada y bloqueada en alemán implicaría cambiar su iframe src De:

src="https://omny.fm/shows/show-slug/clip-slug/embed"

Para:

src="https://omny.fm/shows/show-slug/clip-slug/embed?t=1m05s&autoplay=1&lang=de"

Las opciones disponibles son:

  • Reproducir desde: use el parámetro de cadena de consulta t para iniciar el reproductor a una hora especificada. El formato de hora es ##m##s por minutos y segundos. Por ejemplo, use ?t=5s para comenzar a las 00:00:05 o ?t=1m05s para comenzar a las 00:01:05.

  • Reproducción automática: usar el parámetro de cadena de consulta autoplay con el valor 1 para habilitar la reproducción automática al cargar. (Nota: la reproducción automática no funcionará en todos los navegadores modernos de escritorio y móviles debido a restricciones de medios). Por ejemplo: ?autoplay=1.

  • Seleccionar clip en la lista de reproducción incrustada: use el parámetro de cadena de consulta selectedClip con un ID de clip para preseleccionar un clip en una lista de reproducción incrustada. Por ejemplo: ?selectedClip=365994b2-ce5c-4984-8aeb-4679add7b905.

  • Ocultar lista de reproducción en la lista de reproducción incrustada: use el parámetro de cadena de consulta list con el valor 0 para ocultar la lista de listas de reproducción en una lista de reproducción incrustada para simular una incrustación que se actualiza automáticamente. También deberá cambiar la altura a '180' en el código iframe.

  • Limitar el número de clips en la lista de reproducción incrustada: use el parámetro de cadena de consulta limit con un valor entero positivo para limitar el número de clips que se muestran en una lista de reproducción incrustada. Por ejemplo: ?limit=5 hará que se muestren hasta 5 clips.

  • Bloquear incrustación en un idioma específico: de forma predeterminada, los reproductores incrustados de Omny Studio se mostrarán en el idioma del navegador/sistema operativo del usuario (donde sea compatible). Para mostrar siempre un reproductor incrustado en un idioma específico, utilice el parámetro de cadena de consulta lang con un código de idioma compatible (consulte la lista a continuación). Por ejemplo: ?lang=de para alemán.

Idiomas admitidos

  • Árabe (con soporte RTL) - ar

  • Checo - cs

  • Inglés - en

  • Francés - fr-fr, Francés canadiense - fr-ca

  • Alemán - de

  • Hebreo (con soporte RTL) - he

  • Italiano - it

  • Japonés - ja

  • Malasio - ms

  • Portugués - pt-pt, Portugués brasileño - pt-br

  • Español - es

  • Turco  - tr

Player.js

Los desarrolladores pueden controlar mediante programación el reproductor incrustado mediante la biblioteca Javascript Player.js.

oIncrustar

Omny proporciona una API oEmbed en https://omny.fm/oembed