Cómo mostrar fotos en WordPress en columnas y filas

¿Quieres mostrar las fotos de WordPress en columnas y filas?

Por defecto, WordPress añade las imágenes en una columna vertical una encima de otra. Sin embargo, si está añadiendo varias fotos a una entrada de blog, esto no parece muy limpio y requiere mucho desplazamiento para sus usuarios.

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

Por qué necesita fotos de WordPress en columnas y filas

Por defecto, cuando añades varias imágenes a una entrada de un blog de WordPress, aparecen una al lado de la otra o una encima de la otra.

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

Puedes resolver fácilmente este problema mostrando las fotos en filas y columnas utilizando una estructura / disposición / diseño / plantilla. De este modo, las imágenes aparecerán en una estructura / disposición / diseño / plantilla compacta y mejorará la experiencia del usuario en tu sitio web.

Si tiene un sitio web de fotografía, puede mostrar su porfolio de forma más atractiva. O puedes mostrar más imágenes de productos en una tienda online mostrándolas en filas y columnas.

Dicho esto, echemos un vistazo a cómo mostrar las fotos de WordPress en columnas y filas manualmente o utilizar un plugin de WordPress. Simplemente haga clic en los enlaces de abajo para saltar a su sección preferida.

1. Mostrar fotos en columnas y filas sin plugins

Este método no requiere la instalación de un plugin en su sitio web de WordPress. Si no añades varias fotos con demasiada frecuencia, este método te funcionará perfectamente.

Puede añadir imágenes manualmente a un bloque de columnas o utilizar el bloque de galería por defecto de WordPress.

Añadir imágenes a un bloque de columnas

En primer lugar, tienes que crear una nueva entrada o editar una ya existente en la que quieras mostrar tus fotos. Una vez en la pantalla del editor de contenido, haz clic en el botón “+” para añadir un bloque de columnas.

A continuación, puede elegir el número de columnas que desea y su estructura / disposición / diseño / plantilla.

Por ejemplo, puede elegir una proporción 50/50, 33/66, 25/50/25, etc.

A continuación, puede añadir un bloque de imágenes a cada columna.

Basta con hacer clic en el botón “+” y seleccionar el bloque “Imagen”.

A continuación, tendrás que añadir una imagen al bloque.

Puede hacer clic en el botón “Subir” para añadir una imagen de su ordenador o seleccionar la opción “Biblioteca de medios” para utilizar una imagen existente.

Una vez abierta la biblioteca de medios, sólo tienes que seleccionar la imagen que prefieras y hacer clic en el botón “Seleccionar”.

Una de las mejores prácticas de optimización de imágenes es añadir un texto alternativo a la imagen. Esto permite a los robots de los motores de búsqueda entender tu imagen y mostrarla en los resultados de búsqueda de imágenes.

Ahora debería ver su imagen en uno de los bloques de columnas.

Ahora puedes hacer lo mismo con otros bloques de la columna y añadir más imágenes.

Añadir imágenes en un bloque de galería

WordPress también ofrece un bloque de galería por defecto que puede utilizar para mostrar imágenes en columnas y filas.

Para empezar, haga clic en el botón “+” y añada un bloque Galería en el editor de contenido.

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

Para este tutorial, elegiremos la opción “Biblioteca de medios”.

A partir de ahí, sólo tienes que seleccionar las imágenes que quieras añadir a tu galería y mostrarlas en filas y columnas.

Una vez elegidas las imágenes, haz clic en el botón “Crear una nueva galería”.

A continuación, WordPress le pedirá que introduzca leyendas para cada imagen y que reorganice el pedido / orden de las imágenes.

Una vez hecho esto, basta con hacer clic en el botón “Insertar galería”.

Ahora debería ver sus imágenes en el bloque de la galería.

Puede ajustar el número de filas al hacer clic en el carrusel / control deslizante del panel de ajustes de la derecha.

Una vez que hayas terminado, sólo tienes que publicar tu entrada para ver las imágenes en columnas y filas.

Basta con visitar su sitio para verlos 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 a menudo en tu sitio web, este método carece de varias características importantes.

Por ejemplo, la apariencia de las fotos depende de tu tema de WordPress y estás limitado a esa estructura / disposición / diseño / plantilla en particular.

Tus imágenes no se abrirán en una caja de luz emergente y los usuarios tendrán que cargarlas como una página nueva y luego pulsar el botón atrás para volver a la página original.

Para una experiencia de usuario más profesional y atractiva, debería probar el método de los plugins.

2. Mostrar fotos en columnas y filas usando un plugin

El mejor plugin para añadir fotos en columnas y filas es Envira Gallery. Es el plugin de galerías para WordPress más popular, es muy fácil de usar y ofrece muchas características.

En primer lugar, debe instalar y activar el plugin Envira Gallery. Para más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Tras la activación, debe visitar la página Envira Gallery ” Ajustes para introducir su clave de licencia. Puede obtener esta clave desde su cuenta en el sitio web de la galería Envira.

Ya está listo para crear hermosas galerías de imágenes.

Simplemente diríjase a Envira Gallery ” Añadir nuevo desde el escritorio de WordPress para crear su primera galería.

En primer lugar, tendrás que introducir un nombre para tu galería en la parte superior. A partir de aquí, puedes seleccionar y subir archivos desde tu ordenador o desde la biblioteca de medios de WordPress.

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

A continuación, tienes que hacer clic en la pestaña “Configuración” para personalizar cómo quieres que se muestren tus pestañas.

Envira Gallery le permite elegir diferentes disposiciones de la galería. Para mostrar las imágenes en filas y columnas, puede seleccionar las disposiciones de cuadrícula, albañil y cuadrada.

Tras seleccionar la disposición, puede hacer clic en el menú desplegable “Número de columnas de la galería” y elegir cuántas columnas desea mostrar.

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

Después, puede hacer clic en el botón “Publicar” para que su galería de fotos esté lista para ser añadida a su sitio WordPress.

Ahora, tienes que editar una entrada 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 Galería’.

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

Ahora puedes guardar tu entrada y verla previa para ver tus fotos en columnas y filas en una bonita galería de fotos adaptable al móvil.

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

Bonificación: Cree un tema personalizado con columnas y filas de imágenes

También puede crear temas de WordPress personalizados que tengan un marcador de posición para añadir imágenes en columnas y filas.

La mejor manera de crear un tema personalizado es utilizando un SeedProd. Es el mejor maquetador de sitios web de arrastrar y soltar que ofrece temas prediseñados y muchas opciones de personalización.

Puede añadir un bloque de columnas a los diseños de su página de destino utilizando SeedProd y añadir imágenes a las filas y columnas. SeedProd incluso viene con un bloque de galería incorporado que puede utilizar para esto.

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

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

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.