Query loop pagination

Issue 1: Multiple Pagination Blocks

Grid and offset patterns create multiple Query Loops, each with its own pagination block.

Solution:
Use a single Query Loop with a grid layout and configure the “Offset” setting for layout control. Add one Pagination block within this Query Loop.

Issue 2: Ugly Pagination URLs

Grid patterns generate URLs like /?query-321-page=2 instead of /page/2/.

Solution:
Consolidate Query Loops to a single instance. Alternatively, add custom rewrite rules in PHP to clean up the URLs.

Consolidating Query Loop

Ensure you use only one Query Loop block in the block editor. For grid layouts, avoid separate loops for each column.

<!-- Example PHP for Query Loop in Template -->
$args = array(
    'posts_per_page' => 6, // Total posts to display
    'paged'          => get_query_var('paged', 1),
);
$query = new WP_Query($args);

if ($query->have_posts()) : ?>
    <div class="posts-grid">
        <?php while ($query->have_posts()) : $query->the_post(); ?>
            <div class="post-item">
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <p><?php the_excerpt(); ?></p>
            </div>
        <?php endwhile; ?>
    </div>
    <div class="pagination">
        <?php
        echo paginate_links(array(
            'total' => $query->max_num_pages,
        ));
        ?>
    </div>
<?php endif; wp_reset_postdata();

Rewrite Rules for Clean URLs

Add this to your theme’s functions.php file to ensure clean pagination URLs:

add_action('init', function() {
    add_rewrite_rule(
        '^page/([0-9]+)/?$',
        'index.php?pagename=your-page-slug&paged=$matches[1]',
        'top'
    );
});

Note: Replace your-page-slug with the actual page slug. This will clean up pagination URLs while consolidating the Query Loop ensures a single pagination block.