Bienvenidos a la octava clase del curso de Page Builder. En la lección de hoy del curso de Page Builder maquetaremos imágenes en un grid, en un carousel, y en un slider, y veremos las mejores formas de usarlas.
8.1 - Grid de imágenes
El grid de imágenes es simplemente una galería. Una forma de colocar una colección de imágenes todas seguidas, con un cierto criterio estético. Vamos a ver cómo hacerlo fácilmente.
Como veis, no hay ninguna complicación. Sólo colocar las imágenes, configurar los anchos y altos máximos, y ya lo tenemos todo listo.
8.2 - Carousel de imágenes
El carousel va un paso más allá, ya que las imágenes que muestra están ligadas a un contenido, ya sea este un post, una página, un producto, etc. El caso está en que es una forma gráfica de mostrar el contenido de nuestra web.
Ya veis que yo no soy gran defensor de este tipo de funcionalidades, precisamente por las razones que enumero en el vídeo. O sea que intentad no abusar de estos elementos. Y hablando de "elementos" de los que no se debe abusar... Vamos a por los sliders.
8.3 - Slider de imágenes
Llega el momento de los sliders. Ya sabéis que yo no defiendo su uso, sólo bajo ciertos casos, pero si los queréis usar... así es cómo se hace:
Una vez más: Sobretodo no lo uséis para colocar CTAs, porque os puede dar muchos problemas, como comento en el episodio 64. Guerra a los sliders del podcast. Sólo como elemento decorativo, como habéis visto en el vídeo. Y aún así, con una cierta limitación, ya que cada imagen recargará la página, haciéndola más y más lenta.
Bien, y con esto acabamos la lección de hoy. Todos a hacer deberes, colocando grids, carouseles y sliders de prueba, para comprobar que todo esté correcto. Nos vemos en la próxima, ya preparando la recta final del curso. ¡Hasta entonces! :)
Todos los capítulos de este curso:
- Curso de Page builder #1: Introducción al editor visual
- Curso de Page builder #2: Widgets de WordPress y configuración
- Curso de Page builder #3: Widgets de Page Builder
- Curso de Page builder #4: Botones y llamada a la acción
- Curso de Page builder #5: Hero
- Curso de Page builder #6: Construyendo una home con destacados
- Curso de Page builder #7: Elementos multimedia
- Curso de Page builder #8: Imágenes
- Curso de Page builder #9: Página de precios
- Curso de Page builder #10: Página de contacto