0

I'm currently working on displaying recent posts in 'masonry grid'. Because of multiple issues I came out with the idea of displaying pre-defined rows of that grid (due to designed layout).

First I did all that without dynamic content (posts). Then I tried to get WP_Query to work. But instead of displaying multiple posts in one row, I'm displaying one multiplied post per each row.

I already did "more posts" button - and it reveals content as described above too.

I suppose that prev_post() method may be wrong for that case, but I didn't found in Codex anything that might be better.

Below I attach part of code & screens to better show both problem and desired effect.

$wpb_all_query = new WP_Query([
    'post_type' => 'post',
    'post_status' => 'publish',
    'posts_per_page' => '4',
]);

if ($wpb_all_query->have_posts()) {
    while ($wpb_all_query->have_posts()) {
        ob_start();
        ?>

        <div class="list_row three_col">
            <div class="column column_1_3">
                <?php
                $wpb_all_query->the_post();  //1 - the newest post 
                get_template_part('partials/list-single-post-masonry');
                ?>
            </div>
            <div class="column column_1_3">
                <?php
                $wpb_all_query->prev_post(); //2 - older older than 1
                get_template_part('partials/list-single-post-masonry');

                $wpb_all_query->prev_post(); //3 - older than 2
                get_template_part('partials/list-single-post-masonry');
                ?>
            </div>
            <div class="column column_1_3">
                <?php
                $wpb_all_query->prev_post(); //4 - older than 3
                get_template_part('partials/list-single-post-masonry');
                ?>
            </div>
        </div>

        <?php
        $generated_content = ob_get_contents();
        ob_end_clean();
        wp_reset_postdata();

    }
}

return $generated_content;

SCREEN no.1 - how it's looking now

SCREEN no.2 - how it should look like

0

Change $wpb_all_query->prev_post() to $wpb_all_query->the_post().

Class WP_Query does not have prev_post() method, it has the next_post() method, which takes the next post from the results (set up post member of WP_Query object), but it does not set the global variable. To reach for the data of the current post, you must use $wpb_all_query->post (eg. $wpb_all_query->post->post_name ) or use $wpb_all_query->setup_postdata() to set the global variable $post.

$wpb_all_query->the_post() is equivalent to:

$wpb_all_query->next_post();
$wpb_all_query->setup_postdata();
  • Works like a charm, thx! – Bajeczny Aug 2 at 11:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.