AdNow

loading...

HTML YouTube Videos

HTML YouTube Videos


La forma más fácil de reproducir videos en HTML es usar YouTube.

Luchando con formatos de video?

Anteriormente en este tutorial, ha visto que podría tener que convertir sus videos a diferentes formatos para que se reproduzcan en todos los navegadores.
Convertir videos a diferentes formatos puede ser difícil y tomar mucho tiempo.
Una solución más fácil es dejar que YouTube reproduzca los videos en su página web.

ID de video de YouTube

YouTube mostrará una identificación (como XGSy3_Czz8k) cuando guarde (o reproduzca) un video.
Puede usar esta identificación y hacer referencia a su video en el código HTML.

Reproducción de un video de YouTube en HTML

Para reproducir su video en una página web, haga lo siguiente:
  • Sube el video a YouTube
  • Tome nota de la identificación del video
  • Defina un elemento <iframe> en su página web
  • Deje que el atributo src apunte a la URL del video
  • Use los atributos de ancho y alto para especificar la dimensión del jugador
  • Agregue cualquier otro parámetro a la URL (ver a continuación)

Ejemplo: uso de iFrame (recomendado)

<iframe width="420" height="315"
src="https://www.youtube.com/embed/XGSy3_Czz8k"
>

</iframe>
Pruebelo usted mismo »

Reproducción automática de YouTube

Puede hacer que su video comience a reproducirse automáticamente cuando un usuario visita esa página agregando un parámetro simple a su URL de YouTube.
Nota: Considere cuidadosamente al decidir reproducir automáticamente sus videos. Iniciar un video automáticamente puede molestar a su visitante y terminar causando más daño que bien.
Valor 0 (predeterminado): el video no se reproducirá automáticamente cuando se cargue el reproductor.
Valor 1: el video se reproducirá automáticamente cuando se cargue el reproductor.

YouTube - Reproducción automática

<iframe width="420" height="315"
src="https://www.youtube.com/embed/XGSy3_Czz8k?autoplay=1"
>

</iframe>
Pruebelo usted mismo »


Lista de reproducción de YouTube

Una lista de videos separados por comas para jugar (además de la URL original).

YouTube Loop

Valor 0 (predeterminado): el video se reproducirá solo una vez.
Valor 1: el video se repetirá (para siempre).

YouTube - Loop

<iframe width="420" height="315"
src="https://www.youtube.com/embed/XGSy3_Czz8k?playlist=XGSy3_Czz8k&loop=1"
>

</iframe>
Pruebelo usted mismo »

Controles de YouTube

Valor 0: los controles del reproductor no se muestran.
Valor 1 (predeterminado): se muestran los controles del reproductor.

YouTube - Controles

<iframe width="420" height="315"
src="https://www.youtube.com/embed/XGSy3_Czz8k?controls=0"
>

</iframe>
Pruebelo usted mismo »

YouTube - Utilizando <object> o <embed>

Nota: YouTube <object> y <embed> quedaron obsoletos a partir de enero de 2015. En su lugar, debe migrar sus videos para usar <iframe>.

Ejemplo - Uso de <objeto> (obsoleto)

<object width="420" height="315"
data="https://www.youtube.com/embed/XGSy3_Czz8k"
>

</object>
Pruebelo usted mismo »

Ejemplo - Uso de <embed> (obsoleto)

<embed width="420" height="315"
src="https://www.youtube.com/embed/XGSy3_Czz8k"
>
Pruebelo usted mismo »

Formulario de contacto

Nombre

Correo electrónico *

Mensaje *

Entradas más populares de este blog

Listado pasaporte y cedulas SAIME 2018

Etiqueta HTML < abbr >

HTML < a > tag

Visitas a este blog