Un feed de blog estándar (una columna vertical de entradas, una debajo de otra) funciona bien cuando tiene diez publicaciones. Cuando tiene cien, el desplazamiento vertical se convierte en un scroll infinito: los lectores pierden el interés en la tercera pantalla y la profundidad de visualización cae a cero.

Una galería de publicaciones (una cuadrícula de tarjetas en 2 a 4 columnas) resuelve el problema de forma eficiente. Una sola pantalla contiene el triple de entradas, la vista tiene algo donde posarse y las tasas de clic aumentan gracias a las miniaturas grandes. Para una página de inicio, una página de categoría o una landing page personalizada, este es el formato más eficaz.

A continuación, tres maneras de construir una galería de publicaciones en WordPress. Desde un enfoque completamente nativo (sin plugins) hasta código flexible para desarrolladores. Cada una incluye pasos concretos, sin generalidades vagas.

💡 Resumen rápido:

• Elija su método: el bloque Query Loop nativo (sin plugins), el plugin Post Grid (máxima personalización) o código personalizado con WP_Query + lightbox (para desarrolladores).
• Para Query Loop: abra una página en el editor, añada un bloque Query Loop → Empezar en blanco → seleccione una plantilla de tarjeta → active Vista de cuadrícula → configure las columnas.
• Para Post Grid: instale el plugin desde el repositorio de WordPress.org, cree una cuadrícula en Post Grid → Añadir nuevo, configure la consulta y la apariencia, inserte el shortcode en cualquier página.
• Para código personalizado: añada WP_Query con paginación a una plantilla del tema, envuelva la salida en un div grid usando CSS Grid, conecte GLightbox o Fancybox para las ventanas emergentes.

Método 1: bloque Query Loop, sin plugins

Desde la versión 5.8, el núcleo de WordPress incluye el bloque Query Loop. Ahora, en WordPress 7.0, es una herramienta madura: un constructor que muestra una cuadrícula de publicaciones directamente en el editor de bloques. Sin plugins, shortcodes ni edición de archivos del tema.

Cree una página nueva o abra una existente, haga clic en "+" en el editor. Busque "Query Loop" y añada el bloque. Le ofrecerá varios diseños prediseñados; seleccione Empezar en blanco para construir una tarjeta desde cero.

Aparecerá un prototipo ante usted: una sola publicación con una miniatura, título y fecha. Ahora el paso clave: en la barra de herramientas del bloque, haga clic en el icono Vista de cuadrícula (una cuadrícula de cuadrados). La lista se convertirá instantáneamente en una cuadrícula. El número de columnas se configura en la barra lateral; para la mayoría de los temas, 3 es lo óptimo.

Configure el contenido de la tarjeta según sus necesidades. Haga clic en la miniatura y en la barra lateral active la opción Enlazar a la publicación; ahora al hacer clic en la imagen se accede a la publicación. Haga lo mismo con el título. La fecha se puede eliminar: haga clic en ella → tres puntos → Eliminar fecha.

Los ajustes adicionales de Query Loop están en la barra lateral del bloque: selección de categoría, ordenación (por fecha, por título, aleatoria) y número de publicaciones por página. Si necesita excluir ciertas publicaciones, use el campo Excluir.

Ventajas: completamente nativo, no ralentiza el sitio, funciona con cualquier tema de bloques. Desventajas: no tiene filtrado por categoría sin recargar la página ni animaciones complejas; para eso necesita un plugin.

Método 2: el plugin Post Grid, máxima flexibilidad

Cuando el Query Loop nativo no es suficiente y necesita filtrado, diseño masonry, un slider o efectos hover, The Post Grid de RadiusTheme entra en escena. Este plugin tiene más de 250 valoraciones y más de 100.000 instalaciones activas en WordPress.org, probado hasta la versión 6.9.4.

La instalación es estándar: Plugins → Añadir nuevo → buscar "The Post Grid" → Instalar → Activar. Tras la activación, aparece un elemento de menú Post Grid → Añadir nuevo.

El proceso de creación de la cuadrícula tiene cuatro pasos:

Paso 1, Consultar publicaciones. Elija el tipo de contenido: entradas, páginas o un tipo personalizado. Filtre por categorías, etiquetas, autores. Orden: por fecha, título o aleatorio. El número de publicaciones también se establece aquí.

Paso 2, Diseños. Haga clic en Crear diseño y construya la tarjeta visualmente: hay etiquetas disponibles para miniaturas con y sin enlaces, título, fecha, autor y extracto. Arrastre los campos necesarios al lienzo y haga clic en Publicar. Vuelva a la configuración de la cuadrícula y seleccione el diseño que acaba de crear.

Paso 3, Estilo del elemento. Configure el relleno, el radio del borde, la sombra, las fuentes y los colores. El número de columnas para escritorio, tableta y móvil también se establece aquí.

Paso 4, Shortcode. Copie el shortcode generado, abra una página en el editor, añada un bloque Shortcode y pegue el código. Listo.

La versión Pro añade filtrado AJAX (los lectores cambian de categoría sin recargar la página), además de scroll infinito, cuadrícula masonry y soporte para tipos de contenido personalizados. El precio comienza en $49 al año.

Ventajas: control total sobre la apariencia, funciona con cualquier tema y maquetador visual (Elementor, Divi). Desventajas: la versión gratuita carece de filtrado AJAX y masonry; el plugin añade CSS y JS, por lo que en sitios muy ligeros el aumento de 50 a 80 KB puede ser notable.

Método 3: código personalizado con WP_Query, para desarrolladores

Si está construyendo un tema desde cero o modificando un tema hijo, puede construir la galería completamente con código. Esto es más ligero que un plugin (ni un solo kilobyte extra) y le da un control absoluto sobre la estructura HTML.

La plantilla a continuación es un punto de partida funcional mínimo. Añádala a un archivo del tema (por ejemplo, front-page.php en un tema hijo) o mediante el plugin Code Snippets con un hook en template_redirect:

1
<?php
2
$paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
3
$args  = array(
4
    'post_type'      => 'post',
5
    'posts_per_page' => 12,
6
    'paged'          => $paged,
7
    'orderby'        => 'date',
8
    'order'          => 'DESC',
9
);
10
$query = new WP_Query( $args );
11
if ( $query->have_posts() ) : ?>
12
    <div class="post-grid">
13
        <?php while ( $query->have_posts() ) : $query->the_post(); ?>
14
            <article class="post-card">
15
                <a href="<?php the_permalink(); ?>">
16
                    <?php the_post_thumbnail( 'medium_large' ); ?>
17
                    <h3><?php the_title(); ?></h3>
18
                </a>
19
                <time datetime="<?php echo get_the_date( 'c' ); ?>">
20
                    <?php echo get_the_date(); ?>
21
                </time>
22
            </article>
23
        <?php endwhile; ?>
24
    </div>
25
    <?php the_posts_pagination(); ?>
26
<?php endif; wp_reset_postdata(); ?>
27

Cuadrícula CSS, CSS Grid nativo, sin frameworks:

1
.post-grid {
2
    display: grid;
3
    grid-template-columns: repeat(3, 1fr);
4
    gap: 24px;
5
}
6
@media (max-width: 768px) {
7
    .post-grid {
8
        grid-template-columns: repeat(2, 1fr);
9
    }
10
}
11
@media (max-width: 480px) {
12
    .post-grid {
13
        grid-template-columns: 1fr;
14
    }
15
}

Tres columnas en escritorio → dos en tableta → una en teléfono. repeat(3, 1fr) significa "tres columnas de igual ancho" y gap: 24px establece el espacio entre tarjetas.

Para una galería aleatoria, reemplace 'orderby' => 'date' por 'orderby' => 'rand'. La consulta mezcla las publicaciones en cada carga de página, exactamente lo que describe la idea original de este tutorial.

El lightbox se conecta por separado. Dos opciones probadas: GLightbox (gratuito, alrededor de 5 KB comprimido, sin jQuery) y Fancybox 5 (licencia MIT, soporte de galería integrado). Añada un atributo data al enlace:

1
<a href="<?php the_post_thumbnail_url( 'full' ); ?>" class="glightbox" data-gallery="post-gallery">
2
    <?php the_post_thumbnail( 'medium_large' ); ?>
3
</a>

Inicialice GLightbox en su main.js:

1
const lightbox = GLightbox({
2
    selector: '.glightbox',
3
    touchNavigation: true,
4
    loop: true,
5
});

Este enfoque le da una galería de publicaciones completamente personalizada con un lightbox que pesa menos de 10 KB sobre la carga estándar de WordPress. Importante: antes de editar archivos del tema, haga una copia de seguridad completa usando el plugin Duplicator o una instantánea del hosting. Si coloca código en functions.php, use un tema hijo para no perder los cambios al actualizar.

Vea un video corto: instalación de The Post Grid en 8 minutos, desde la búsqueda del plugin en el repositorio hasta una cuadrícula activa en la página:

⁉️🤔 Preguntas frecuentes

¿Qué método debo elegir para un blog normal?

Si tiene un tema de bloques, empiece con Query Loop. Es un bloque nativo, cero plugins y no ralentiza el sitio. Para tres columnas con miniaturas, es más que suficiente. Pase a un plugin solo cuando necesite diseño masonry o filtrado sin recargar la página.

¿Por qué necesito una galería de publicaciones si mi tema ya las muestra?

El feed estándar de un tema es una lista vertical. Una galería en cuadrícula muestra de 3 a 4 veces más publicaciones en la primera pantalla. Densidad → mayor interacción → menor tasa de rebote. Para páginas de inicio y landing pages personalizadas, esto es crítico.

¿Query Loop funciona con temas clásicos?

Sí, si el tema no ha bloqueado el editor de bloques mediante remove_theme_support. Para temas muy antiguos construidos con shortcodes y widgets, The Post Grid es una mejor opción, ya que funciona con cualquier cosa a través de un shortcode normal.

¿Puedo hacer una cuadrícula de publicaciones con lightbox gratis?

Sí, el método 3 es completamente gratuito: WP_Query del núcleo + CSS Grid del núcleo + GLightbox bajo licencia MIT. Coste cero, rendimiento puro. La desventaja es que necesita conocimientos básicos de PHP y CSS.

¿Query Loop romperá mi sitio cuando WordPress se actualice?

No. Query Loop es un bloque nativo del núcleo; se actualiza con WordPress y se somete a pruebas completas en cada versión. El parámetro showposts (el enfoque antiguo con get_posts) quedó obsoleto en la versión 3.1, y los métodos modernos no se rompen durante las actualizaciones mayores.

¿Cómo cambio el número de columnas en móvil?

En Query Loop, use la barra lateral del bloque en Ajustes de cuadrícula: puede establecer un número de columnas diferente para cada punto de ruptura (escritorio, tableta, móvil). En The Post Grid, vaya al paso Estilo del elemento para los mismos puntos de ruptura. En código personalizado, use media queries en CSS (como se muestra en el ejemplo anterior).

Qué método usar en 2026

Para nueve de cada diez sitios, el bloque Query Loop es suficiente. Es nativo, ligero y se puede montar en dos minutos sin documentación. Si necesita filtrado por categoría sin recargar la página, cuadrícula masonry o integración con Elementor, instale The Post Grid: más de 100.000 instalaciones y más de 250 valoraciones en WordPress.org hablan por sí solas.

El código personalizado con WP_Query es la elección para quienes construyen un tema desde cero o mantienen un sitio de alto tráfico donde cada kilobyte cuenta. También es la única manera de obtener una galería de publicaciones aleatoria sin plugins: 'orderby' => 'rand' en los argumentos de WP_Query hace exactamente lo que los desarrolladores solían escribir en páginas de código hace diez años usando get_posts y lightboxes caseros.

Elija el método que se ajuste a su tarea y haga densa la primera pantalla de su sitio; los lectores se lo agradecerán desplazándose hacia abajo.