Loop within a loop?

Question

I'm using a couple of custom wp_query loops on my page, the first one retrieves news from a certain category then displays a small excerpt from it with the permalink.

The second one is another wp_query that gets a custom post type with a few advanced custom fields.

The problem is I'd like another loop within the second one that gets 3 posts from the news section with a thumbnail (basically the opposite of the first loop, it'll get all the other categories). After reading countless articles on the loop I can't figure out how to make a 'nested' loop within my second loop. I'm sure it's got to be simple, seems like something that'd be easy to do.

Here's my code with a lot of html stripped out.

<?php 
/*
*  Template Name: Homepage
*/
?>

<?php get_header(); ?>

<div class="thenews">

    <div class="newsinner">

        <div class="grid-1">
            <h6 class="nsix">latest news</h6>
        </div> <!-- end div grid-1 -->

        <div class="grid-2">
            <?php
            $recentPosts = new WP_Query();
            $recentPosts->query('cat=5&showposts=1');
            ?>
            <?php while ($recentPosts->have_posts()) : $recentPosts->the_post(); ?>
            <p><?php echo ''.get_the_twitter_excerpt(); ?>...</p>
        </div> <!-- end div grid-2 -->   

        <div class="grid-3">
            <a href="<?php the_permalink() ?>">Read it</a>
            <?php endwhile; wp_reset_query(); ?>
        </div> <!-- end div grid-3 -->

    </div> <!-- end div newsinner -->

</div> <!-- end div thenews -->

<div id="main-content">

    <div class="typograhpy">

        <div class="home-grid-1">

            <div class="home-grid-1-inner">
                 <?php
                 $portfolio_query = new WP_Query(array(
                    'post_type' => 'headerhome',
                    'showposts' => 1
                ) );
                ?>
                <?php while ($portfolio_query->have_posts()) : $portfolio_query->the_post(); ?>
                <h2><?php the_title(); ?></h2>  
                <?php the_content(); ?>

                <div class="anyres">
                    <p> <?php the_field('anyresolution'); ?></p>
                </div> <!-- end div anyres -->

            </div> <!-- end home-gird-1-inner -->

        </div> <!-- end home-grid-1 -->

        <div class="home-grid-2">

            <div class="inner-home-1">
                <div class="inside-home-1-1">
                 <h2><?php the_field('services_'); ?></h2>
                 <p> <?php the_field('services_text'); ?></p>
                </div> <!-- end div inside-home-1-1 -->
                <div class="inside-home-1-2">
                    <p> <?php the_field('services_text_right'); ?></p>
                </div> <!-- end div inside-home-1-2 -->
            </div> <!-- end div inner-home-1 -->

            <div class="margindiv"></div>

            <div class="inner-home-2">
                <div class="brushpic"></div> <!-- end div brushpic -->
                <h3><?php the_field('services_1_header') ?></h3>       
                <p><?php the_field('services_1_content'); ?></p>
            </div><!-- end div inner-home-2 -->

            <div class="inner-home-3">
                <div class="cloudpic"></div> <!-- end div cloudpic -->
                <h3><?php the_field('services_2_header') ?></h3>       
                <p><?php the_field('services_2_content'); ?></p>
            </div> <!-- end div inner-home-3 -->

            <div class="inner-home-4">
                <div class="onetwoone"></div> <!-- end div onetwoone -->
                <h3><?php the_field('services_3_header') ?></h3>       
                <p><?php the_field('services_3_content'); ?></p>
            </div> <!-- end div inner-home-4 -->

        </div> <!-- end div home-grid-2 -->

        <div style="clear:both"></div>

    </div> <!-- end div typograhpy -->

    <div class="graphgrid">
    </div> <!-- end div graphgrid -->

    <div class="sizesdes">                
        <blockquote><?php the_field('gallery_blockquote_') ?></blockquote>     
        <p><?php the_field('gallery_content'); ?></p>
        <?php endwhile; wp_reset_query(); ?>
    </div> 

</div><!-- end div main-content -->
<?php get_footer(); ?>

Working code, though it won't retrieve the_post_thumbnail

<?php
global $post;$backup=$post;
$inner_query = new WP_Query();
$inner_query->query('showposts=3');
?>

<?php while ($inner_query->have_posts()) : $inner_query->the_post(); $post=$backup; ?>

    <?php the_post_thumbnail(); ?>

    <p><?php echo ''.get_the_custom_excerpt(); ?>...</p>

    <a href="<?php the_permalink() ?>">Read it</a>

<?php endwhile; ?>

Answer 1

You can create any number of loops as you wish by creating more WP_Query objects

$query = new WP_Query($args);

while ($query->have_posts()) :

    // initialization for $inner_args & backup the current global $post
    $inner_query = new WP_Query($inner_args);

    while ($inner_query->have_posts()) :
        // do something
    endwhile;
    // restore the global $post from the previously created backup

endwhile;

EXPLANATION AS REQUESTED

Whenever you call a template tag such as the_title();, it displays something about the current post in the loop. But how does it know which post is the current post? It is done by reading the information from the global postdata (stored in a global variable $post)

When using a loop you always use a $query->the_post() as the first statement. What this function do is set that global data to the next post from the WP_Query object (the previous contents are lost)

Here when you called the inner loop, the postdata related to the outer loop was getting lost when the inner loop starts working. Then whatever function you use after the end of inner loop is still finding only the inner loop's data.

In the solution you first saved the outer loop's data in another variable before the contents get lost. Then the loop works as it's supposed to be(deleting all outer loop data).

Then when the inner loop's work is done, you now need to use the outer loop's data but it is lost due to the inner loop. This is where you take the previously saved data & replace it. Now you're back to the position you were at when you started the inner loop

Answer 2

You can use WP_Query::reset_postdata() for this too.

$query = new WP_Query($args);

while ($query->have_posts()) :

    // initialization for $inner_args & backup the current global $post
    $inner_query = new WP_Query($inner_args);

    while ($inner_query->have_posts()) :
        // do something
    endwhile;

    // restore the global $post from the previously created backup
    $query->reset_postdata();

endwhile;

Answer 3

Add global $post;$backup=$post; before the inner while & $post=$backup; after the inner while.

(Why didn't Mridul Aggarwal write the real thing in his code part?)