Cómo mostrar fotos de WordPress en columnas y filas

¿Quieres mostrar fotos de WordPress en columnas y filas?

Por defecto, WordPress agrega imágenes en una columna vertical una encima de la otra. Sin embargo, si estás agregando varias fotos a una publicación de blog, esto no se ve muy limpio y requiere que tus usuarios se desplacen mucho.

En este artículo, te mostraremos cómo mostrar fácilmente fotos de WordPress en columnas y filas.

Por qué necesitas fotos de WordPress en columnas y filas

Por defecto, cuando agregas varias imágenes a una publicación de blog de WordPress, aparecerían una al lado de la otra o una encima de la otra.

Esto no se ve muy bien, y tus usuarios deben desplazarse mucho para ver varias imágenes y fotos.

Puedes resolver fácilmente este problema mostrando fotos en filas y columnas usando un diseño basado en cuadrícula. De esta manera, las imágenes aparecerán en un diseño compacto y mejorarán la experiencia del usuario en tu sitio web.

Si tienes un sitio web de fotografía, puedes mostrar tu portafolio de una manera más atractiva. O puedes mostrar más imágenes de productos en una tienda en línea mostrándolas en filas y columnas.

Dicho esto, veamos cómo mostrar fotos de WordPress en columnas y filas manualmente o usar un plugin de WordPress. Simplemente haz clic en los enlaces a continuación para saltar a tu sección preferida.

• Mostrar fotos en columnas y filas sin plugins
• Mostrar fotos en columnas y filas usando un plugin
• Extra: Crear un tema personalizado con columnas y filas de imágenes

1. Mostrar fotos en columnas y filas sin plugins

Este método no requiere instalar un plugin en tu sitio web de WordPress. Si no agregas varias fotos con demasiada frecuencia, esto funcionaría perfectamente para ti.

Puedes agregar imágenes manualmente a un bloque de columnas o usar el bloque de galería predeterminado en WordPress.

Agregar imágenes a un bloque de columnas

Primero, necesitas crear una nueva publicación o editar una existente donde quieras mostrar tus fotos. Una vez que estés en la pantalla del editor de contenido, haz clic en el botón '+' para agregar un bloque de columnas.

A continuación, puedes elegir el número de columnas que deseas y su diseño.

Por ejemplo, puedes elegir una proporción de 50/50, 33/66, 25/50/25, y más.

Después de eso, puedes agregar un bloque de imagen a cada columna.

Simplemente haz clic en el botón '+' y selecciona el bloque 'Imagen'.

A continuación, necesitarás agregar una imagen al bloque.

Puedes hacer clic en el botón 'Subir' para agregar una imagen desde tu computadora o seleccionar la opción 'Biblioteca de medios' para usar una imagen existente.

Una vez que se abra la biblioteca de medios, simplemente selecciona tu imagen preferida y haz clic en el botón 'Seleccionar'.

Una de las mejores prácticas de optimización de imágenes es agregar un texto alternativo a tu imagen. Esto permite que los bots de los motores de búsqueda entiendan tu imagen y la muestren en los resultados de búsqueda de imágenes.

Ahora deberías ver tu imagen en uno de los bloques de columnas.

Ahora, puedes hacer lo mismo para otros bloques en la columna y agregar más imágenes.

Agregar imágenes en un bloque de galería

WordPress también ofrece un bloque de galería predeterminado que puedes usar para mostrar imágenes en columnas y filas.

Para empezar, haz clic en el botón ‘+’ y agrega un bloque de Galería en el editor de contenido.

A continuación, deberás subir imágenes o elegirlas de la biblioteca de medios.

Para este tutorial, elegiremos la opción ‘Biblioteca de medios’.

Desde ahí, simplemente selecciona las imágenes que deseas agregar a tu galería y muéstralas en filas y columnas.

Una vez que elijas las imágenes, haz clic en el botón ‘Crear una nueva galería’.

A continuación, WordPress te pedirá que ingreses leyendas para cada imagen y reorganices el orden de las fotos.

Después de hacer eso, simplemente haz clic en el botón ‘Insertar galería’.

Ahora deberías ver tus imágenes en el bloque de galería.

Puedes ajustar el número de filas haciendo clic en el control deslizante en el panel de Configuración a la derecha.

Una vez que hayas terminado, simplemente publica tu entrada para ver las imágenes en columnas y filas.

Simplemente visita tu sitio para verlas en acción.

Este método funcionaría para la mayoría de los principiantes. Sin embargo, si tienes un blog de fotografía o compartes fotos con frecuencia en tu sitio web, entonces a este método le faltan varias características importantes.

Por ejemplo, la apariencia de las fotos depende de tu tema de WordPress y estás limitado a ese diseño y estilo en particular.

Tus imágenes no se abrirán en una ventana emergente Lightbox y los usuarios tendrán que cargarlas como una nueva página y luego presionar el botón de retroceso para volver a la página original.

Para una experiencia de usuario más profesional y atractiva, deberías probar el método del plugin.

2. Mostrar fotos en columnas y filas usando un plugin

El mejor plugin para agregar fotos en columnas y filas es Envira Gallery. Es el plugin de galería de WordPress más popular, súper fácil de usar y ofrece muchas funciones.

Primero, debes instalar y activar el plugin Envira Gallery. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Tras la activación, debes visitar la página Envira Gallery » Settings para introducir tu clave de licencia. Puedes obtener esta clave desde tu cuenta en el sitio web de Envira Gallery.

Ahora, estás listo para crear hermosas galerías de imágenes.

Simplemente ve a Envira Gallery » Add New desde el panel de WordPress para crear tu primera galería.

Primero, deberás introducir un nombre para tu galería en la parte superior. Desde aquí, puedes seleccionar y subir archivos desde tu computadora, o puedes seleccionar desde la biblioteca de medios de WordPress.

Después de subir tus fotos, las verás aparecer en el cuadro de configuración de la galería a continuación.

A continuación, debes hacer clic en la pestaña 'Configuration' para personalizar cómo quieres mostrar tus fotos.

Envira Gallery te permite elegir diferentes diseños de galería. Para mostrar imágenes en filas y columnas, puedes seleccionar los diseños grid, mason y square.

Después de seleccionar el diseño, puedes hacer clic en el menú desplegable ‘Número de columnas de la galería’ y elegir cuántas columnas deseas mostrar.

Si te desplazas hacia abajo, verás más opciones para personalizar tu galería. Por ejemplo, hay configuraciones para editar las dimensiones y el tamaño de tu galería.

Después de eso, puedes hacer clic en el botón ‘Publicar’ para que tu galería de fotos esté lista para ser añadida a tu sitio de WordPress.

Ahora, necesitas editar una publicación o crear una nueva. Una vez que estés en el editor de contenido, simplemente haz clic en el botón ‘+’ para añadir el bloque ‘Envira Gallery’.

Desde aquí, puedes hacer clic en el menú desplegable y seleccionar la galería que creaste anteriormente.

Ahora puedes guardar tu publicación y previsualizarla para ver tus fotos en columnas y filas en una hermosa galería de fotos adaptable a dispositivos móviles.

Ahora, cuando tus usuarios hagan clic en una miniatura de foto, se abrirá en una hermosa ventana emergente. También podrán navegar por las imágenes sin salir de la página.

Extra: Crear un tema personalizado con columnas y filas de imágenes

También puedes crear temas personalizados de WordPress que tengan un marcador de posición para agregar imágenes en columnas y filas.

La mejor manera de crear un tema personalizado es usando SeedProd. Es el mejor constructor de sitios web de arrastrar y soltar que ofrece temas preconstruidos y muchas opciones de personalización.

Puedes agregar un bloque de columnas a los diseños de tu página de destino usando SeedProd y agregar imágenes a filas y columnas. SeedProd incluso viene con un bloque de Galería incorporado que puedes usar para esto.

Para obtener más información, consulta nuestra guía sobre cómo crear un tema personalizado de WordPress sin código.

Esperamos que este artículo te haya ayudado a aprender cómo mostrar fotos de WordPress en columnas y filas. También te puede interesar nuestra guía sobre cómo solucionar problemas comunes de imágenes en WordPress y el mejor software de diseño para pequeñas empresas.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.