How to show next Post Thumbnail image in WordPress using current post id

i make a wordpress theme i make a grid structure show below
i have this grid structure

Grid Structure

it contain two rows and every row has three column
i want to show my wordpress random posts in this grid

this is my code

               <div class="row">
                     <div class="col-xs-12">
                         <div class="rst-mediagrid">
                                <div class="div">

                                                <?php $args = array(
                                                      'posts_per_page'   => 6,
                                                       'offset'           => 0,
                                                       'category'         => '2',
                                                       'category_name'    => '',
                                                       'orderby'          => 'date',
                                                       'include'          => '',
                                                       'exclude'          => '',
                                                       'meta_key'         => '',
                                                       'meta_value'       => '',
                                                       'post_type'        => 'post',
                                                       'post_mime_type'   => '',
                                                       'post_parent'      => '',
                                                       'author'    => '',
                                                       'post_status'      => 'publish',
                                                       'suppress_filters' => true 
                                                );


                                                global $post;
                                                $post = get_post($args);

                                                $next_post = get_adjacent_post( true, '', false, 'taxonomy_slug' ); 

                                              ?>


                            <div class="rst-col rst-col-50">
                                <div class="rst-postpic">
                                    <?php echo get_the_post_thumbnail($post->ID); //latest post thumbnail ?>
                                </div>
                            </div>
                                                        <?php //endif; ?>

                            <div class="rst-col rst-col-25">
                                <div class="rst-postpic rst-postvideo">

                                    <?php echo get_the_post_thumbnail($next_post->ID); ?>
                                </div>
                            </div>

                            <div class="rst-col rst-col-25">
                                <div class="rst-postpic">
                                    <?php echo get_the_post_thumbnail($next_post->ID); ?>
                                </div>
                            </div>

                            <div class="clear"></div>
                        </div>
                        <div class="div">
                            <div class="rst-col rst-col-25">
                                <div class="rst-postpic">
                                    <?php echo get_the_post_thumbnail($next_post->ID); ?>
                                </div>
                            </div>
                            <div class="rst-col rst-col-25">
                                <div class="rst-postpic rst-postvideo">
                                    <?php echo get_the_post_thumbnail($next_post->ID); ?>
                                </div>
                            </div>
                            <div class="rst-col rst-col-50">
                                <div class="rst-postpic">
                                    <?php echo get_the_post_thumbnail($next_post->ID); ?>
                                </div>
                            </div>
                            <div class="clear"></div>
                        </div>
                    </div>
                </div>
            </div>

the above code repeat the same image i want to show thumbnails in a perfact order like first row has three columns and first column has latest image second column has image of previous post and third column has image of previous of previous mean 3rd post from latest post and second row also has same things if you have better suggestion kindly tell me

2 Answers
2

Here is the template layout and code for your original question. I am using wp_get_recent_posts as it gives me recent posts from the category as you wanted, if not change orderby to rand for random posts, as wp_get_recent_posts return posts by default in array form you can also have a choice to shuffle them.

I checked your answer its not consistent and too much replication of codes as your first post uses rst-postpic and than rst-postinfo and so on, instead of this use post type or some meta field to determine the type of post and according to that print information about post.

Hope it helps and gives you an idea to proceed further.

Happy coding!

<?php
    $args = array(
         'numberposts' =>    6,
         'category'    =>    0,
         'post_status' =>    'publish',
         'orderby'     =>    'post_date',
    );
    $recent_post = wp_get_recent_posts( $args );

    //shuffle( $recent_post );    // Just for randomness
?>
<div class="row">
    <div class="col-xs-12">
        <div class="rst-mediagrid">
            <?php
                 foreach ($recent_post as $key => $value) {
                     $class_col_50    =   $key == 0 || $key == count( $recent_post ) - 1 ? ' rst-col-50' : ' rst-col-25';
                     $class_col_video =   $key % 3 == 1 ? ' rst-postvideo' : '';

                     if ( $key % 3 === 0 )
                         echo '<div class="div">';

                     echo "<div class="rst-col$class">";
                         echo "<div class="rst-postpic$class_col_video">";
                             echo  $value['ID'], ' ';
                         echo '</div>';
                     echo '</div>';

                     if ( $key % 3 === 2 )
                         echo '<div class="clear"></div></div>';
                 }
            ?>
        </div>
    </div>
</div>

Leave a Comment