I have written a query to display recent posts on my homepage. For some reason the first div after the recent posts (latest-2) is displayed inside the recent posts div. Also, the second time I run the query it doesn’t display at all.

I am trying to display recent posts from different categories multiple times as you scroll down the page.

I think I need to do the following:

  1. reset_postdata
  2. create multiple loops instead of one and then repeating?

This is the test website: Test site

This is the existing code:

<div id="container">
 		<?php
 			$recent_posts_query = new WP_Query(array('post_type' => 'post', 'posts_per_page' => 8, 'category_name' => 'technology', 'Fashion/Beauty', 'Art', 'Watches/Jewellery', 'Travel',));
 			while ($recent_posts_query->have_posts()){
  			$recent_posts_query->the_post(); ?>
  	<div class="masonryImage"><?php the_post_thumbnail();?></div>
	<?php } ?>
</div>

<div class="advert-container">
	<img src="http://104.244.127.200/~qmintest/wp-content/uploads/2015/12/Home-Shop-Single-Image-1-1.png" alt="advert">
</div>

<div class="text-header">
	<h1>Editors picks</h1>
</div>

<?php echo do_shortcode('[qodef_portfolio_slider type="fullscreen-slider" order_by="date" order="ASC" category_ID="251" speed="2000"]'); ?>

<div class="text-header">
	<h1>Fashion/Beauty</h1>
</div>

<div class="main-news">
	<?php
	$recent_posts_query = new WP_Query(array('post_type' => 'post', 'posts_per_page' => 3, 'category_name' => 'Fashion-Beauty'));
	while ($recent_posts_query->have_posts()){
    $recent_posts_query->the_post(); ?>
        
        <div class="new">
            <div class="new-content">
                <div class="new-image"><?php the_post_thumbnail('fashion');?></div>
                <div class="new-content-excerpt">
                    <h5><?php
			foreach((get_the_category()) as $category) 
    			echo $category->cat_name . ' '; ?></h5>
                    <h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
                </div>
            </div>
        </div>
   <?php } ?></div>
</div>

<div class="text-header">
	<h1>Latest-2</h1>
</div>

<div class="text-header">
	<h1>Latest</h1>
</div>

<div class="main-news">
	<?php
	$recent_posts_query = new WP_Query(array('post_type' => 'post', 'posts_per_page' => 1, 'category_name' => 'Technology'));
	while ($recent_posts_query->have_posts()){
    $recent_posts_query->the_post(); ?>
        <div class="new">
            <div class="new-content">
                <div class="new-image"><?php the_post_thumbnail('fashion');?></div>
                <div class="new-content-excerpt">
                    <h5><?php
			foreach((get_the_category()) as $category) { 
    		echo $category->cat_name . ' '; 
		}
		?></h5>
                    <h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
                </div>
            </div>
        </div>
   <?php } ?>
</div>

Read more here: How to fix a WordPress recent_posts query


Solution:

If you know the solution of this issue, please leave us a reply in Comment section, to update the question.


Wordpress related questions and answers: