En algunas ocasiones tenemos necesidad de incorporar vídeos que están alojados en servidores de redes sociales como Youtube, Vimeo, Facebook, Instagram, etc… En este breve artículo veremos cómo podemos coger el código de HTML necesario para poder visualizar un vídeo de este tipo directamente en tu página web.
Youtube:
Para incorporar un vídeo en YouTube en una página web, lo único que necesitaremos será conocer la URL del vídeo que queremos mostrar. Esta UrL la obtenemos en la misma página del vídeo, debajo del mismo hay un botón que dice «Compartir«. Lo pulsamos y se despliega más información, con iconos de redes sociales. Debajo de los iconos veremos una URL, la copiamos y la guardamos. Posteriormente, para poner ese video dentro de nuestra página web, necesitaremos poner el siguiente código:
<iframe width=»560″ height=»315″ src=»https://www.youtube.com/embed/AN2EA8w698M» frameborder=»0″ allow=»accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture» allowfullscreen></iframe>
He puesto en negrita el lugar donde podremos la URL del vídeo de Youtube que hemos copiado anteriormente. Podemos ver cómo se visualizaría en el vídeo de abajo.
Youtube en Directo:
De la misma manera que ponemos un vídeo tipo standar de Youtube en una web, podemos hacerlo con un vídeo Streaming que esté emitiendo en directo desde Youtube.
En el ejemplo de abajo vemos NASA Live: Official Stream of NASA TV
https://www.youtube.com/live/21X5lGlDOfg?si=_YoCbJfCAzTzwxGm
Instagram:
Para poner vídeos que estén alojados en Instagram, iniciamos sesión en Instagram y una vez que tengamos el vídeo que queremos incluir en nuestra web, hacemos clic en el menú de tres puntos situado en la esquina superior derecha de la entrada.
Se abrirá una ventana emergente en la que has de seleccionar la opción: «Código de Inserción«.
Nos mostrará otra ventana emergente y solo tienes que pulsar el botón » Copiar código de inserción«. Ese código y lo pondremos dentro de nuestra página web. Al visualizar la página web, se verá el vídeo. No incluyo el código porque es muy muy largo.
Facebook:
Los vídeos de Facebook se pueden incorporar a tu web de la siguiente manera. Una vez que tienes el vídeo visible en tu muro, arriba a la derecha del vídeo, al lado del botón «Seguir», verás unos puntitos … Pulsa sobre ellos y se abrirá un menú con algunas opciones. Pulsa la opción «Insertar» y en la ventana que se abra pulsa sobre el botón «Copiar código». Este es el código que debes pegar en tu página web para que se vea el vídeo.
Vimeo:
Cuando entramos en Vimeo y estamos viendo el vídeo que queremos compartir, en la parte derecha del mismo encontramos una serie de iconos. Uno de ellos tiene una forma de Avión de papel. Este es el icono que tenemos que pulsar para que nos muestre el código que tenemos que poner en la web para incorporar ese mismo vídeo en una web. En la ventana que abre copiaremos el código del campo llamado «Insertar«.
<iframe src="https://player.vimeo.com/video/247869786?h=53dc48c7a2" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
<p><a href="https://vimeo.com/247869786">Paisajes y Amaneceres</a> from <a href="https://vimeo.com/user29889334">Pablo de Castro Portales</a> on <a href="https://vimeo.com">Vimeo</a>.</p>También hay un enlace a la derecha que dice «+Mostrar Opciones» si lo pulsamos se amplia la ventana y nos da la posibilidad de cambiar algunos aspectos del vídeo como el tamaño, color, etc…
El vídeo de Paisajes y Amaneceres es de Pablo de Castro Portales de Vimeo:
Paisajes y Amaneceres from Pablo de Castro Portales on Vimeo.
