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 Google+ Facebook

Escribir un comentario

× Puedes publicar el comentario que quieras, pero si lo considero SPAM será eliminado automáticamente.

Nombre (requerido)

E-mail (requerido)

Sitio web

Introduce tu comentario

Subscribirse a la notificación de nuevos comentarios

Introduce los caracteres

Refescar

He leído y acepto la Política de privacidad

SergioIglesias.NET te informa que los datos de carácter personal que nos proporciones rellenando este formulario serán tratados por Sergio Iglesias Sánchez como responsable de esta web. La finalidad de la recogida y tratamiento de los datos personales que te solicitamos es, únicamente, para gestionar los comentarios de este blog. La legitimación se realiza a través del consentimiento del interesado. Te informamos que los datos que nos facilitas estarán ubicados en los servidores de SiteGround (proveedor de hosting). Ver política de privacidad de Siteground. El hecho de que no introduzcas los datos de carácter personal que aparecen en el formulario como obligatorios podrá tener como consecuencia que no pueda atender tu solicitud. Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en info@sergioiglesias.net así como el derecho a presentar una reclamación ante una autoridad de control. Puedes consultar la información adicional y detallada sobre Protección de Datos en mi política de privacidad.

Enviar comentario

Cancelar

JComments