Cómo embeber vídeos de Youtube y Vimeo en un artículo Joomla

Hoy te traigo un minitutorial para ver diferentes formas que tiene Joomla para embeber vídeos de Youtube y Vimeo en un artículo como este.

De forma manual

Para embeber un vídeo de forma manual en un artículo Joomla sin necesidad de usar ninguna extensión de terceros, simplemente con código, tenemos que hacer lo siguiente:

Vídeo de Youtube

Para embeber un vídeo de Youtube vamos a la página del vídeo correspondiente. Por ejemplo:

https://www.youtube.com/watch?v=ineee4JtKRc

Una vez aquí tienes que pulsar en el botón de "Compartir".

Esto hará que se abra una ventana o "popup" con diferentes formas de compartir el vídeo (redes sociales incluidas).

La opción que te interesa para este caso que proponemos en el artículo es la que pone "Insertar".

Esta opción volverá a abrir una ventana nueva en la que se mostrará el vídeo a la izquierda y el código HTML que necesitamos en la derecha.

Como puedes ver en la imagen tienes disponibles algunas configuraciones.

Al final lo que nos interesa será este código HTML:

<iframe width="560" height="315" src="https://www.youtube.com/embed/ineee4JtKRc" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Una vez que tienes este código, tendrás que poner el editor que utilices de forma que puedas introducir código HTML y pegarlo.

De esta forma, tendrás embebido el vídeo:

Dependiendo de los estilos que tengas en tu plantilla para esta etiqueta iframe se verá de una forma u otra (yo, por ejemplo, tengo que tenga un ancho del 100%).

<div class="embed-responsive embed-responsive-16by9"><iframe class="embed-responsive-item" src="https://www.youtube.com/embed/ineee4JtKRc"></iframe></div>

Vídeo de Vimeo

Si queremos que el vídeo sea de Vimeo los pasos a seguir son similares. Necesitaremos el código HTML que se genera para poder embeberlo.

En este caso, como puedes ver en la imagen anterior, el botón se llama "Compartir" y en la ventana que aparece tienes las diferentes formas de compartirlo. Para este caso que propongo necesitarás el código que aparece en el apartado de "Insertar".

<iframe src="https://player.vimeo.com/video/107463665?title=0&byline=0&portrait=0" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Embeber vídeos en Joomla con extensiones

Para facilitar esta labor de embeber vídeos contamos en Joomla con varias extensiones que paso a listarte a continuación.

Mi recomendación en este sentido es que las pruebes todas y veas cuál se adapta mejor a tu proyecto y al usuario final (el que va a gestionar el contenido de la web).

Listado de extensiones

• OsYouTube: se trata de un plugin que transforma todas las direcciones de Youtube que se encuentra en el contenido en un embebido de forma automática. Es muy facilito y funciona perfectamente.
• OsVimeo: hace lo mismo que su "hermano" pero para vídeos de Vimeo.
• OsEmbed: es el hermano mayor de los plugin anteriores y, además de embeber vídeos de Youtube y Vimeo, embebe prácticamente cualquier cosa.
• AllVideos: uno de los de toda la vida. La verdad que personalmente no me gusta utilizar este tipo de Shorcodes, pero es una alternativa más.

Espero que este artículo te ayude a embeber vídeos en un artículo Joomla.

Si conoces alguna extensión más para esta funcionalidad no dudes en compartirla en los comentarios.

Sobre el autor, Sergio Iglesias

Sergio Iglesias es formador, desarrollador y front-end del CMS Joomla!. A través de su blog y sus cursos puedes aprender a desarrollar tu propio portal web autogestionable.

Conecta conmigo: Twitter Linkedin Github Facebook