Technology, Knowledge and More | Atrum: Personaliza el reproductor de YouTube

Suscríbete a mi blog:

Seguidores

Team

Geost
Editor en Jefe
Cuellito
Cuellin
Colaborador
Cuellito
Kira
Colaborador
kira
Saeta
Colaborador
darksaeta
David
Colaborador
inactivo
jueves, 30 de junio de 2011

Personaliza el reproductor de YouTube

parametros youtube
YouTube permite establecer ciertos parámetros en su reproductor para que realice funciones extra. Todos estos parámetros que les muestro a continuación son opcionales, pero pueden llegar a ser útiles:


Para iniciar, deben conocer donde colocar los parámetros:
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ" width="560"></iframe>
Este es el código inicial que les da YouTube, para que funcionen los parametros deberán ponerlos justo despues de la URL de YouTube y antes de las comillas.
  • El primer parámetro que pongan irá antecedido de un ?
  • Los siguientes parámetros irán antecedidos de un &
  • No debe haber espacios

Parámetros

autohide
Valores: 0, 1 y 2(default)
Oculta automáticamente los controles del reproductor cuando su valor es 1.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?autohide=1" width="560"></iframe>
autoplay
Valores: 0 o 1
Si su valor es uno reproducirá automáticamente el video cuando se haya cargado la página.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?autoplay=1" width="560"></iframe>
controls
Valores: 0 o 1
Dependiendo de su valor, se mostrarán o no los controles de reproducción.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?controls=0" width="560"></iframe>
disablekb
Valores: 0 o 1
Si se pone en valor 1 deshabilitará los controles por medio de teclado, es decir:
  • Barra espaciadora: Play / Pause
  • Flecha izquierda: Retroceder 10%
  • Flecha derecha: Adelantar 10%
  • Flecha arriba: Subir el volumen
  • Flecha abajo: Bajar el volumen
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?disablekb=1" width="560"></iframe>
fs
Valores: 0 o 1
Activa o desactiva la opción de FullScreen ed decir, pantalla completa.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?fs=0" width="560"></iframe>
hd
Valores: 0 o 1
Dependiendo del valor que pongan permitirá la reproducción en alta definición.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?hd=0" width="560"></iframe>
iv_load_policy
Valores: 0 o 3
Si su valor es 3 deshabilitará los comentarios o anotaciones del video.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?iv_load_policy=3" width="560"></iframe>
loop
Valores: 0 o 1
Dependiendo del valor hará que el video se repita indefinidamente.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?loop=1" width="560"></iframe>
modestbranding
Valores: 0 o 1
Si su valor es 1 evitará que el logo de YouTube sea mostrado en la barra de controles.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?modestbranding=1" width="560"></iframe>
rel
Valores: 0 o 1
Dependiendo del valor que se le asigne mostrará o no videos relacionados una vez terminada la reproducción.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?rel=0" width="560"></iframe>
start
Valores: un entero positivo
Indicará en que segundo del video comenzará la reproducción.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?start=15" width="560"></iframe>
showinfo
Valores: 0 o 1
Si es 0 ocultará la información referente al video.
<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?showinfo=0" width="560"></iframe>
Por último les dejo un ejemplo con algunos parámetros combinados:
controls, showinfo, disablekb

Antes de la parametrización:



Después de la parametrización:



<iframe frameborder="0" height="349" src="http://www.youtube.com/embed/Y-IXnlkgUwQ?controls=0&showinfo=0&disablekb=1" width="560"></iframe>
 [Fuente: http://code.google.com]

0 comentarios:

Search

Cargando...

Labels

Blogumulus by Roy Tanck and Amanda Fazani