Hola, en esta ocasión te traigo un tutorial acerca de como poner un fondo negro a un iframe de Vimeo.
Como sabrás Vimeo se especializa en videos, es decir es una plataforma de videos y se pueden subir videos para luego sustraer el código o iframe del video para poder pegarlo en nuestro blog. algo así como pegar un video de youtube en nuestro blog
El asunto es sencillo (al igual que en youtube). Se copia el iframe del video (también se puede llamar embed) y se lo coloca en el html de la entrada de nuestro blog en blogger.. ejemplo
¿Donde Encontramos el iframe del video en Vimeo?
Es sencillo, abres tu cuenta de Vimeo y te vas a Gestionar videos (en la parte de arriba-izquierda) y das click a mis videos.. Luego seleccionas el video al cual vas a sacar el iframe (si tienes muchos videos haces la búsqueda con su buscador) y luego en la parte de la derecha encontrarás un botón que dice compartir y al dar click se abre o desgloza un menú y seleccionas "Copiar codigo de inserción".
Luego el código se copió automaticamente.. te sale un mensaje al pie de la pantalla pero bien rápido que dice "Se copio el codigo de inserción al portapapeles"
Entonces ya copiado el código "al portapapeles" (esto no se ve).. vas a la entrada de tu blog.. y en el html de blog pegas el código y ya está. ahora el video estará en tu blog.
Algunos ajustes que puedes dar al video en el blog
Si bien, ya tienes el video en tu blog, este te sale con un tamaño predeterminado, es decir Vimeo puso esas medidas y puedes modificarlas haciendo algunos ajustes al iframe o código de inserción..
Este es el iframe puro que te da Vimeo
<iframe src="https://player.vimeo.com/video/482471225" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> Si queremos un alto de 440 px o 450px, mas un acho que ocupe el ancho de la entrada modificamos en el iframe lo siguiente
<iframe src="https://player.vimeo.com/video/482471225" width="100%" height="450" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> Te quedaría algo así.. 450 de alto y 100% de ancho. Ocupa todo el ancho de tu entrada de tublog
Ahora, si deseas un fondo negro para el iframe o "video" debes agregar el siguiente código al iframe (en el html de la entrada.
style="background-color: black;"Quedaría de esta manera en el iframe de 450 de alto y 100% de ancho
<iframe src="https://player.vimeo.com/video/482471225" width="100%" height="450" frameborder="0" allow="autoplay; fullscreen" allowfullscreen style="background-color: black;"></iframe>Vimeo no pone fondos negros a tus videos (excepto si les pones claves para verlo o compartir de forma privada con enlaces). En una pc u ordenador no hay ningún problema el video se ve bien. Pero cuando vemos el mismo video en un celular o mobil el fondo es un fondo de color blanco... lo cual deja un espacio poco estético tanto arriba y debajo del video. Y si queremos que nuestro público vea un video, drama o algo de media hora o mas.. lo menos que queremos es que vea espacios en blanco asi que con un fondo negro en el video arreglamos eso. Claro.. el usuario puede optar por pantalla completa, pero su primera impresión será como ver un video en solitario y espacios en blanco tanto arriba como abajo.
Asi vería el usuario en una primera impresión tu video cuando lo vea desde su mobil con un fondo negro
Y así sería en caso de no ponerle fondo negro..
