Este documento explica cómo agregar videos a Joomla de forma responsiva utilizando Bootstrap. Explica que la mayoría de usuarios acceden a internet desde dispositivos móviles y que los videos deben verse bien en todos los dispositivos. Describe cómo usar un contenedor de clase "video" con un iframe de YouTube o Vimeo y estilos CSS para que el iframe se ajuste automáticamente al ancho del dispositivo.

1. Volver video boostrap
para Joomla

2. Esta presentación esta dirigida a
profesionales de diseño en internet
y webmaster
Dificultad de ejecucion: media
Joomla 3.2

3. ¿Por qué HACERLO?
• El 80% de usuarios de internet lo hacen en
tablets, smartphone y otros medios.
• Queremos que nuestros contenidos esten
siempre visibles
SE ROMPE EL
CONTENEDOR
DEL VIDEO
Joomla 3.2
Videos con bootstrap
Videos sin bootstrap

4. • Cuando hablamos de boostrap, estamos hablando de
responsive, tecnología inventada por Twitter, GRACIAS TWITTER
• Usaremos dos componente para la magia, el elemento html con el
cual agregaremos nuestro video, ya sea youtube o vimeo.
• El otro componente es algo de estilos para decirle a nuestro
componente que hacer (CSS)
Joomla 3.2

5. “EL HTML”
CONTENEDOR CLASE VIDEO
EL IFRAME ES BASICAMENTE EL QUE NOS DA
YOUTUBE EN “COMPARTIR
Joomla 3.2

6. “EL CSS”
DEFINIMOS NUESTRA POSICION RELATIVA
ADENTRO DE NUESTRO CONTENEDOR
AQUÍ ES DONDE LE DECIMOS QUE TANTO EL
IFRAME, OBJET Y EMBED SE MANTENGAN
SIEMPRE AL 100%
Joomla 3.2