En este video aprenderemos a colocar una galería totalmente responsiva y con efecto light box en nuestra página web, dejo en claro que el Widget o módulo esta listo para descargar y colocarlo en nuestra página web, entonces vamos directamente con los pasos necesarios, (Al final del artículo hay un video donde explico a detalle cada paso)
Paso número 1: debemos de descargar los recursos para eso debemos darle clic al botón verde “DESCARGA EL MÓDULO”.
Paso número 2: debemos te tener 2 carpetas abiertas una es de nuestro módulo y otro de nuestra página en HTML.
Paso número 3: si en nuestra carpeta de HTML ya tenemos un style.css deberemos cambiar el nombre nuestros estilos de la galería yo le puse galeria.css
Paso número 4: Tenemos que pasar el archivo CSS del módulo que descargamos a nuestra página en HTML.
Paso número 5: Ahora viene mi parte favorita incrustar el código para esto debemos de abrir nuestro editor de código en mi caso uso Brackets y abrimos el index.html de nuestro módulo que descargamos y vamos a pasar primero el css a nuestra página web.
Paso número 6: ahora vamos a pasar el js
Paso FINAL:
Agregar la galería en HTML
Paso extra:
No olvides que en el paso 3 probablemente cambiaste el nombre de style.css, si lo hiciste debes de cambiarlo en el código.
De igual forma dejo un video con una explicación a detalle