Personaliza el reproductor de Youtube a tu gusto
Si alguna vez has intentado compartir alguno de tus vídeos en Internet, te habrás dado cuenta de que no existe una solución buena, bonita y barata. Y con barata, quiero decir gratis.
A no ser que seas una empresa o profesional muy solvente y puedas contratar tu propio servidor para distribuir tus vídeos, te verás obligado a utilizar alguna de las plataformas gratuitas que existen. Principalmente, los profesionales audiovisuales trabajan con Youtube o Vimeo.
Las ventajas e inconvenientes de cada plataforma las explicaré en un post próximamente. En cambio, hoy quiero mostrarte el potencial oculto de la plataforma Youtube y las posibilidades que nos ofrece para personalizar los reproductores que incrustamos en nuestras webs.
A continuación te enseñaré una serie de técnicas que te ayudarán a conseguir la apariencia y la funcionalidad que deseas con tu reproductor de Youtube. Es absolutamente gratis y no se acompaña con publicidad. Incluso, podrás borrar el logo de Youtube del reproductor.
Para ello, deberás utilizar unos pequeños trozos de código como si fueran una contraseña para utilizar funcionalidades ocultas del reproductor. Pero vamos a comenzar por lo básico:
1. Como embeber un vídeo de Youtube
Insertar un vídeo de Youtube en una web se suele llamar embeber, que significa incrustar. Para ello, clickaremos en la pesataña “compartir” de la página del vídeo de Youtube que deseamos compartir. Luego elegiremos “insertar” y nos aparecerá un código. Si copiamos este código y lo pegamos en nuestro blog o web, el vídeo de Youtube aparecerá en nuestra página. Si utilizas WordPress, lo cual recomiendo, asegurate de que tienes seleccionada la pestaña HTML en el editor. Te recomiendo que abras un vídeo de Youtube com este para seguir este proceso.
En esta página de Youtube ya encontramos las primeras funcionalidads para personalizar el reproductor de Youtube. Aquí podrás modificar el tamaño del vídeo indicando el valor que desees. Además, un poco más abajo encontrarás la función de los vídeos relacionados.
2. Desactivar los vídeos relacionados de Youtube
Como ves, por defecto está marcada una frase que dice “Mostrar sugerencias de vídeos cuando finalice la reproducción del vídeo”. Esto provocará que, al finalizar el vídeo, aparezcan vídeos relacionados. Los vídeos que aparecen puede que sean de tu canal de Youtube, pero también puede ser que sean de tu competencia. Como es algo que no se puede controlar, te recomiendo que desactives esta casilla para embeber el vídeo en tu web o blog.
3. Cómo activar y desactivar parametros personalizados en el reproductor de Youtube.
Si seleccionas y deseleccionas la frase de “Mostrar sugerencias….” y miras el código te darás cuenta de que se añade un trozo de código al lado de la URL del vídeo. En este caso, aparece el código “?rel=0” o desaparece.
Rel es el nombre del atributo de los vídeos relacionados. El número nos muestra si está activado (1) o desactivado (0).
El interrogante se pone para indicar que vamos a agregar algunos parámetros personalizados. Para personalizar el reproductor de Youtube, sólo hay que poner un interrogante, el nombre del parámetro que queremos modificar, el signo igual y el valor. Si queremos añadir más de un atributo, utilizaremos el símbolo “&” para enlazarlos.
En los casos en los que no aparezca el atributo, se aplicarán los valores por defecto de Youtube.
4. Cómo reproducir automáticamente un vídeo de Youtube
Si te interesa que el vídeo de Youtube se reproduzca automáticamente cuando el visitante aterriza en tu página, deberás utilizar el parámetro “autoplay”. Para ello, despues de la URL del vídeo escribiremos “?autoplay=1”. De esta manera, el vídeo se reproducirá automáticamente.
El código quedaría así:
Y puedes ver un ejemplo de cómo funcionaría en mi página de vídeos corporativos.
5. Esconder la barra de contrlol de un vídeo de Youtube
Si lo que quieres es que el usuario no pueda interactuar con tu vídeo, necesitarás desactivar los controladores. De esta manera, el reproductor quedará más limpio y obligarás al usuario a que vea el vídeo de principio a fin.
El parámetro que se utiliza para esconder los controladores se llama “control”. Por lo tanto, si los queremos esconder deberemos añadir “?controls=0” en nuestro código despues de la URL del vídeo.
El código quedaría así:
Y el resultado sería este:
6. Esconder la información del vídeo de Youtube.
Si no queremos que aparezca la información del vídeo en la parte superior del reproductor, podemos utilizar el parámetro “showinfo” para ocultarla.
El código quedaría así:
Y el resultado sería este:
7. Personaliza el tema de tu reproductor de Youtube
Pero si lo que quiere es que nadie sepa que el vídeo se está reproduciendo en Youtube (o casi) lo mejor que puedes hacer es cambiar el tema del reproductor. Para ello, utiliza el parámetro “theme”. En este caso, en vez de un 0 o un 1 deberás introducir la palabra “light”. De este módo el código quedaría como “?theme=light”. Además, voy a combinar quitar la información de la parte superior añadiendo “&showinfo=0″
El código completo sería:
Y el reproductor quedaría como este:
8. Ocultar el logo de Youtube de la barra de control
Tal vez pensastes que nunca podríamos borrar del mapa todo rastro de la Marca Youtube? Casi se puede…
Y el paso definitivo para que no parezca que alojas los vídeos en Youtube es ocultar su logo. Para ello, utilizaremos el comando “modestbranding” y le daremos el valor 1.
El código sería así:
Y el resultado, aplicado al ejemplo anterior, quitando la barra de control sería este:
Sé que aparece un logo de Youtube sobreimpreso cuando el puntero se posa sobre el vídeo. Esto es lo máximo que podemos hacer con el reproductor e Youtube. Si este logo te molesta, lo único que te queda es pagar por alojar los vídeos en tu propio servidor o alquilar uno como Amazon SW3 o similares.
Y, a parte de estos parámetros, hay algunos más que podrías explorar por ti mismo. Para ver la lista completa de parámetros a modificar visita esta web de Google.
Y si te ha gustado el artículo, te recomiendo que te subscribas a mi newsletter donde comparto contenido aún más valioso que este y que no publico en el blog.
El mundo audiovisual está cambiando. El cine ha salido de las salas, el vídeo invade internet, las empresas tienen cada vez más demanda de vídeo pero ya no sirven los típicos vídeo corporativo… Por eso, si quieres estar a la última de todo lo que te afecta como profesional audiovisual y adaptarte a la nueva era, escribe tus datos aquí y sólo te enviaré información relevante para ti y nuestro sector.
<
Muchas gracias Nestor, es lo que me hacía falta para mejorar nuestro canal, somos autodidactas. asi que nos viene de perlas tus consejos.
Por supuesto estoy subscrita a tu blog!!!
Me alegro. Un saludo y hasta la próxima! Espero seguir ayudando en esta línia en la newsletter y en el blog.
Hola muy bueno tu pos, como puedo hacer para que funcionen los codigos a la vez, por ejemplo: quiero que se reproduzca solo, que no aparezca la barra de control ni que se vea la informacion del video,
Saludos y gracias
Hola Ángel,
Muchas gracias por tu comentario.
Para hacer lo que dices deberías ir sumando los diferentes trozos de código añadiendo un signo & entre ellos.
Para el ejemplo que dices, deberías usar este código
?autoplay=1&controls=0&showinfo=0
De manera que la URL de tu código se viera así
src=”http://www.youtube.com/embed/9u6XrWLnSF8?autoplay=1&controls=0&showinfo=0″
Siento no poder ponerte el código completo pero lo he intentado y no se visualizaba.
Saludos!
Muy bueno amigo, me sirvio de mucho 😀
Hay mas trucos que podias añadir, por ejemplo que se reproduzca automaticamente en HD
Me alegro Jose! Me podrías decir cómo se hace para reproducir automáticamente en HD y así lo añado a la entrada?
Muchas gracias!
hay que añadir ‘?hd=1′
un saludo y sigue poniendo cosas interesantes como estas
Gracias Jose, lo añadiré al artículo cuando tenga tiempo.
Saludos!
Hola Nestro, muchas gracias por el post, justo lo que estaba buscando, mil gracias, Saludos !
Gracias a ti Juan por comentar. Hasta otra!
POr los que no les sirvio el auto play en el codigo
?autoplay=1&controls=0&showinfo=0
falta poner & antes de autoplay
?&autoplay=1&controls=0&showinfo=0
Hola Josué,
Nunca he tenido problemas con el autoplay, pero gracias por comentarlo!
de nada ^^
Hola amigo ,Re bueno tu post .Quisiera saber si se puede editar o cambiar el reproductor de Youtube. Gracias , espero tu respuesta !!
Hola Bryan,
Yo he explicado las maneras que conozco de personalizarlo, puede que haya alguna más.
Si lo que quieres es no utilizar el reproductor de Youtube, hay otros servicios similares o puedes alojar tu mismo los vídeos y utilizar un reproductor gratuito o de pago tipo Easy video player.
Gracias por el comentario y hasta otra!
¿Y si sólo quiero que se reproduzca el audio? ¿Sabrías hacerlo Néstor?
Hola Néstor, no se porque pero se ha borrado mi anterior mensaje ¿?
Simplemente preguntaba si conoces alguna manera de reproducir únicamente el audio de los videos de Youtube.
Gracias
Hola Eduardo,
El comentario no se había borrado, estaba a la espera de que lo aprobara.
En cuanto a tu pregunta, no sé si se puede hacer, pero por qué no utilizas un servicio que reproduzca sólo audio como Soundcloud?
Un saludo!
Muy bueno el tutorial, bueno además no necesito ocultar totalmente el logo de youtube, gracias
Me alegro que te sirva! Gracias a ti por comentar
Todo excelente, simplemente un detalle que no logro corregir. Al personalizar el reproductor pierdo la opcion de reproduccion a pantalla completa. Hay modo de poder conservarla?
Hola Leo,
Siempre que mantengas la barra de control tendrás pantalla completa. Si no, no podrás (ya que no hay controles).
Saludos!
en la parte final añade allowfullscreen
iframe width=”430″ height=”400″ src=”//www.youtube.com/embed/zaSZE194D4I?rel=0&showinfo=0″ frameborder=”0″ allowfullscreen
Interesante Tus Tips Amigo… Pero al aplicar el modestbranding=1 ..No funciona del todo … ya que si maximizas la ventana … La informacion del Video Aparece !.. Atento a eso
Hola Gustavo,
Por lo que dices, puede ser que confundas “showinfo” con “modestbranding”. Es lo único que se me ocurre.
Podrías pasarme un link en vivo de lo que te sucede para saberlo con seguridad?
Gracias!
hola nestor! me vino muy bien esta información, pero estoy con un problema que no puedo solucionar. he puesto un video desde youtube con este código:
pero sólo se reproduce localmente o desde el navegador safari. ¿por qué no funciona en ningún otro? me estoy volviendo loca! gracias!!!
Muchísimas gracias Nestor Spin! Me has ayudado muchísimo, me estaba volviendo loco porque no era capaz de poner los videos de youtube a tamaño personalizado.
Gracias de nuevo, un cordial saludo!
Gracias, todo muy bueno! justo lo que necesitaba 😉
Me alegro!
Hola que tal Nestor, tengo una duda para editar el reproductor de youtube con los codigos que nos has proporcionado, por lo que veo solo sirve par la funcion de “embed”, pero mi duda es si puede servir para la funcion “watch”?
Yo necesito ejecutar un video desde mi sitio, pero no lo quiero incrustar, deseo que al dar click en el enlace, este me envie directamente al video proyectado con un lightbox, pero con la idea de desaparecer los controles, el logo de youtube y todo lo demas que se pueda quitar.
te paso el link de mi sitio
http://www.garcia-herreros.org/inversiones.html
espero tu pronta y cordial respuesta, saludos.
Hola Hugo,
Ya he visto que lo conseguiste. Es una buena funcionalidad, seguro que la uso en el futuro.
Muchas gracias!
ante todo muchas gracias por todos los consejos ya que nos facilitas la vida una enormidad!
Mi pregunta es la siguiente: hay algún código para reproducir el video en la máxima calidad posible?
Muchas gracias por tu ayuda.
Hola! De verdad, lo más completo que he encontrado para edición de videos Youtube. Pero -por favor- ¿me puedes decir si hay forma de acortar un video en este código? Quisiera que un video de 8 minutos durara , por ejemplo, 5 min. 20 seg. ¿Es posible modificarlo desde el código HTML?
Muchas gracias!!
Seria Posible cambiar el icono de resprodicir y pausar que aparece el centro..
No creo que sea posible pero me parece una buena cosa para comentarles a ellos.
Gracias!
Buen material, para sacarle el mayor provecho a Youtube, pero quisiera saber si existe la manera de usar youtube como en el paso 8.
8. Ocultar el logo de Youtube de la barra de control
Pero tambien ocultando el logo de la pantalla, por que aparece cuando uno intenta desaparecer el logo por completo, en fin como si nunca desaparece el logo de Youtube.
¿ Algun consejo ?
Saludos
Imagino que no se puede, Youtube te aloja el vídeo y quiere aparecer en algún lado.
Si no quieres que aparezca su nombre deberás alojarlo en tu propio servidor o Amazon S3 o similares y reproducirlo con otro player (esto ya es temad e diseño/programación web).
Muchas gracias
He puesto un logo/marca de agua en mi canal de YouTube porque quiero que los vídeos que suba A PARTIR DE AHORA lo tengan. El problema viene porque veo que también se añade a los vídeos antiguos; es decir, a los que había subido anteriormente, algo que no quiero que ocurra. Pregunta: ¿Es posible que el logo se incorpore solo y exclusivamente en los vídeos nuevos que suba a partir de ahora, pero que NO APAREZCA en los antiguos que ya había subido anteriormente?. Muchas gracias.
enorme Néstor! andaba buscando esto hace tiempo.
pero una pregunta:
¿se puede mesclar los puntos 5,6 y 7?
¿o sólo deja modificar por separado?
Hola Néstor,
Tengo un vídeo en Youtube y cuando éste finaliza, aparecen un seguido de sugerencias sobre otros vídeos.
La opción “Mostrar sugerencias de vídeos cuando finalice la reproducción del vídeo” está desactivada y la fórmula “rel=0″ también está incrustada en el código, por defecto.
Aun así, cada vez que mi vídeo termina de reproducirse, aperecen las recomendaciones de forma automática. El vídeo está en Youtube, no en un Blog u otro portal web.
¿Hay algún modo de desactivar esta opción de modo que, cuando termine mi vídeo (en el mismo Youtube), aparezca pantalla en negro, por ejemplo o, simplemente, no aparezcan las sugerencias?
Gracias!
Mariana
Hola Néstor
Lo he aplicado todo pero me sigue apareciendo toda la información¡¡
¿Ha cambiado algo?
¿Sabes si es posible ocultar la publicidad?
Increible… Me sirvió muchísimo y aparte muy bien explicado. Muchísimas gracias!!
Hola Néstor, tengo una duda, en cuanto al logo de youtube, sé que estará presente a pesar de miles y miles de trucos que hay, sin embargo creo que ese no es el problema, ¿hay posibilidad de que al darle clic al logo, NO me dirija al video, para reproducirlo en youtube (porque ahí ya se vería el nombre, datos de la cuenta etc ya de nada serviría ocultar todo si el dichoso logo te va a delatar enviándote al canal donde está alojado dicho video), si no que en vez de eso, al darle clic al logo me mande a la página principal de youtube, como si el video del blog no existiera para youtube?, me gustaría saber este truco, pues podría subir mis videos sin que exista la posibilidad de que alguien sepa el nombre de mis videos, y sobre todo de mi cuenta, más aún te salvaguarda de que puedan reportarlos, pues ya no tendrían esa opción, ya pude ocultar sus características (nombre, canal etc.), ya logre cambiar el reproductor, ocultar el logo de youtube, (gracias a tus trucos), pero me falta la cereza del pastel, quiero que ese logo no me abra el video en una pestaña, quiero que al darle clic (al logo del tube) quede sin efectos (que no se pueda ver en youtube) y que a cambio (como he visto en algunos blogs) al darle clic si lo quiero ver fuera del blog, no se pueda, si no que envié a la página principal de youtube, no sé si me explique, espero me puedas ayudar, gracias por compartir tus trucos, te felicito por esta labor desinteresada e encomiable, saludos!!.
¿Existe la posibilidad de poner un video como oculto para youtube, pero como público cuando compartes en un blog (por ej. WordPress)?
Me explico, que el video a pesar de estar subido en la plataforma de youtube, si lo comparto en un blog, que sólo ese video sea visto por la gente que visita mi blog
Hola me podrías orientar y resolver esto? Cómo le hago para q se vean los vídeos relacionados del lado derecho pero con el texto COMPLETO es decir está MOCHO el contenido o texto y no sé q contienen porque no se alcanzan a ver completa la información como amplio sólo esta parte ?
Gracias
Muchas gracias por el artículo. Me ha parecido muy interesante y muy completo. Había visto algunas ideas sueltas, pero no todas juntas. Gracias!!!
como hago lo mismo pero con otros videos que no son de youtube
como hago lo mismo pero con otros videos que no son de youtube por ejemplo como este:
Gracias por la ayuda!