¿Cómo reproducir videos de YouTube en mi sitio web?

Como incrustar en nuestras páginas web el código proporcionado por los sitios de almacenamiento de videos

Id de video en YouTube

YouTube mostrará un ID (como: aqz-KE-bpKQ) para cada video almacenado. Así, se puede utilizar este Id y hacer la referencia de el video en el código HTML de tu sitio web.

Reproducir un video de YouTube en HTML

Para incorporar un video de YouTube en tu código HTML, se debe copiar el código que te proporciona el mismo sitio YouTube dando clic en el botón "Compartir" y te mostrará una ventana emergente con más botones de diferentes redes sociales, así damos clic en el botón "incorporar" y nos muestra ahora otra ventana emergente en donde nos muestra el código HTML, el cual debes de copiar e incorporarlo a tu código HTML.

El código que te facilita YouTube es un elemento <iframe> con el atributo src apuntando al Id del video y otros atributos más:

<iframe width="560" height="315" 
  src="https://www.youtube.com/embed/aqz-KE-bpKQ" frameborder="0" 
  allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" 
  allowfullscreen>
</iframe>

Muestra:

AutoPlay del video

Se puede especificar el autoplay para que el video inicie su reproducción automaticamente cuando la página es visualizada añadiendo un simple parametro en la URL del video de YouTube.

Los parametros son:

  • Valor 0 (predeterminado): El video no se reproducirá automaticamente cuando se carge el reproductor.
  • Valor 1 : El video si se reproducira automanticamente cuando se carge el reproductor.

Nota: Tenga en consideración la aplicación de la página que contiene el video, dado que reproducir videos automaticamente puede causar molestia a los visitantes.

<iframe width="560" height="315" 
  src="https://www.youtube.com/embed/aqz-KE-bpKQ?autoplay=1">
</iframe>

Lista de Reproducción

Para crear una lista de reproducción se agrega una lista separada por comas para reproducir videos adicionales al original en la URL.

Bucle de Reproducción

Los parámetros son:

  • Valor 0 : (valor predeterminado) El video se reproducirá una sola vez.
  • Valor 1 : El video se reproducirá indefinidamente.
<iframe width="560" height="315" 
  src="https://www.youtube.com/embed/aqz-KE-bpKQ?autoplay=tgbNymZ7vqY&loop=1">
</iframe>

Controles de Reproducción

Los parámetros son:

  • Valor 0 : Los controles de reproducción no se mostraran.
  • Valor 1 : (valor predeterminado) Los controles de reproducción se mostraran.
<iframe width="560" height="315" 
  src="https://www.youtube.com/embed/aqz-KE-bpKQ?controls=0">
</iframe>