Multiple loops for custom post type to spread data across rows

Question

How do I split the values within a custom post type loop so that the title is in the first loop which outputs in the first DIV and the content is in the second loop outputting in the second DIV? Two loops may not be the best way to do, I don't know. Somebody mentioned to me about using one loop then storing each item in a string and then splitting the string. I have no idea how to do this either.

I also need a new row to begin once the number of posts reach 5.

Here's my PHP loop...

        $custom_query = new WP_Query( $custom_args );

        query_posts(array( 
                            'post_type' => array('team')

                        ) ); 


        if ( $custom_query->have_posts() ) : 

              /* Start my loop */

              while ( $custom_query->have_posts() ) : $custom_query->the_post();

                 echo "<div>". the_title(); . "</div>";

                 echo "<div>". the_content(); . "</div>";


              endwhile;

        endif;

The HTML output i'm looking for as follows...

<div class"row">

  <div class="title chris"></div>
  <div class="title darren"></div>
  <div class="title ryan"></div>
  <div class="title john"></div>
  <div class="title emma"></div>

  <div class="content chris"></div>
  <div class="content darren"></div>
  <div class="content ryan"></div>
  <div class="content john"></div>
  <div class="content emma"></div>

</div>

<div class"row">

  <div class="title steve"></div>
  <div class="title ed"></div>
  <div class="title steph"></div>
  <div class="title neil"></div>
  <div class="title claire"></div>

  <div class="content steve"></div>
  <div class="content ed"></div>
  <div class="content steph"></div>
  <div class="content neil"></div>
  <div class="content claire"></div>

</div>

<div class"row">

  <div class="title tarnea"></div>
  <div class="title carl"></div>
  <div class="title kim"></div>
  <div class="title jade"></div>
  <div class="title lee"></div>

  <div class="content tarnea"></div>
  <div class="content carl"></div>
  <div class="content kim"></div>
  <div class="content jade"></div>
  <div class="content lee"></div>

</div>

Answer 1

Have you tried using rewind_posts()?

It looks to me like what you'll have to do is either run the entire query only outputting titles then rewind and output content (however this would output all titles before the content, not in blocks of 5 as you have suggested) or wrap everything in a loop which runs the same query limited to 5 posts each time, then increment the offset parameter by 5 each time (Pagination Parameters).

EDIT: Your third, potentially long-winded, solution is to save 5-title blocks and 5-content blocks into separate arrays, then print them out at the end in the order you want.

Answer 2

You can try something like this

$titels = "";
$content = "";
$html = "";
$counter = 1;

while ( $custom_query->have_posts() ) : custom_query->the_post();
   if ( counter % 5 = 0 ) :
      $html = "<div class='row'>" . $titels . $content . "</div>";
      $titels = "";
      $content = "";
   endif; 
   $titels .= "<div>". the_title(); . "</div>";
   $content .= "<div>". the_content(); . "</div>";
   $counter++;
endwhile;

print $html;