Set loop format & have a loop inside other one

Question

You can easily achieve this by using a multiple loop, or a loop inside a loop.

Let’s assume you have your normal page template with the standard WordPress loop, outputting your wrapper <div class="page"> and the title:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <div class="page">
        <div class="title">
            <?php the_title(); ?>
        </div>
        <!-- other loop will go here -->
    </div>
<?php endwhile; endif; ?>

Now you need to call a new instance of WP_Query, with all the $args that you need.

Please do not just use query_posts( $args )!, as this is not intended to be used by themes and plugins.

Your second loop would look something like this:

$second_query = new WP_Query( $args );
while ($second_query->have_posts()) : $second_query->the_post(); // Loop through the second loop and set up post data
?>
    <div class="thread">
        <div class="img-cont"></div>
        <?php $second_query->the_content(); ?>
    </div>
<?php endwhile; ?>

All together this could be an example of your code:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <div class="page">
        <div class="title">
            <?php the_title(); ?>
        </div>

        <?php
            $second_query = new WP_Query( $args );
            while ($second_query->have_posts()) : $second_query->the_post(); // Loop through the second loop and set up post data
        ?>
                <div class="thread">
                    <div class="img-cont"></div>
                    <?php $second_query->the_content(); ?>
                </div>
        <?php 
            endwhile;
        ?>
    </div>
<?php endwhile; endif; ?>

Of course, you can also have two custom loops instead of the standard WordPress one:

<?php 
    $first_query = new WP_Query( $args );
    while ($first_query->have_posts()) : $first_query->the_post();
?>
    <div class="page">
        <div class="title">
            <?php $first_query->the_title(); ?>
        </div>

        <?php
            $second_query = new WP_Query( $args );
            while ($second_query->have_posts()) : $second_query->the_post(); // Loop through the second loop and set up post data
        ?>
                <div class="thread">
                    <div class="img-cont"></div>
                    <?php $second_query->the_content(); ?>
                </div>
        <?php 
            endwhile;
        ?>
    </div>
<?php endwhile; ?>

Related Posts: