1

This is a continuing question from Merging a complex query with post_rewind and splitting posts into two columns

Hi, I need help with my loop. What is does is split posts into two columns.

<?php $row_start = 1; while ( $query->have_posts() ) : $query->the_post(); ?>

    <?php if ( in_array( get_the_ID(), $duplicates ) ) continue; ?>
        <?php if( $row_start % 2  != 0) {// odd ?>
            <div class="post">
                left - <?php the_title();?><br>
            </div>
        <?php } ;?>
        <?php if( $row_start % 2 == 0) {// even ?>
            <div class="post">
                right - <?php the_title();?><br>
            </div>
        <?php } ;?>

<?php ++$row_start; endwhile; wp_reset_postdata(); endif; ?>

It outputs the loop as the following:

<div class="left">post</div>
<div class="left">post</div>
<div class="right">post</div>
<div class="left">post</div>
<div class="right">post</div>
<div class="left">post</div>
<div class="right">post</div>

What I would to do is to wrap all posts in a div, like the following:

<div class="left">
post
post
post
</div>
<div class="right">
post
post
post
</div>

Thanks

1

You could always try to create 2 arrays of titles, say $left and $right, $odd and $even, or $tom and $jerry, and fill them with the titles during your loop, and print them after the loop has ended like so:

Create array

$left = $right = array();

Then unleash your loop [edited the below to reflect the comments]

<?php // The loop

  if ( $query->have_posts() ) : $row_start = 1; 
  while ( $query->have_posts() ) : $query->the_post();

  if ( in_array( get_the_ID(), $duplicates ) ) continue;
    if( $row_start % 2  != 0) {
      // odd: add result to $left
      // $left[] = get_the_title();
      $left[] = $post->id;
    } else {
      // even: add it to $right
      //$right[] = get_the_title();
      $right[] = $post->id;
    }
    ++$row_start; endwhile; wp_reset_postdata();
  // now loop has ended and we have 2 full arrays
  // that we can print each in it's div
  print "<div class=\"left\">";
  foreach($left as $postID) {
    $postData = get_post( $postID );
    print $postData->post_title;
    print $postData->post_content;
    // etc... you can also get thumbnails using the post ID:
    print get_the_post_thumbnail($postID, 'thumbnail');
  }
  print "</div>";
  // next column
  print "<div class=\"right\">";
  foreach($right as $postID) {
    // ... just like the above...
  }
  print "</div>";
  endif;

?>

I've not yet tested this but it should work (or some close variation of it). I personally would output the list of posts in unordered lists (<ul class="right or left">) and put each title in an <li>.

Good luck :)

  • It works but the_title() is a placeholder. I will be adding more items like thumbnail,meta_fieldsand the_content. – Gregory Schultz Jul 29 '16 at 4:44
  • In that case, I would either do the same but only storing post IDs in the arrays, then outputting the title, post image etc while iterating the arrays, either use jgraup's solution below that calls the whole loop twice :) – gloria Jul 29 '16 at 14:48
  • 1
    If you mean you want to also output the featured image (post thumbnail), you can use the post ID with 'get_the_post_thumbnail()'. Added it in the example above, link to the docs here: developer.wordpress.org/reference/functions/… – gloria Jul 31 '16 at 0:41
  • 1
    Regarding the post ID, it is nothing more than the unique identification of a post. When you have that ID, you can use the multitude of functions available to gather anything you want linked to that post (it's data, it's attachments, it's author, it's stats etc...). It's then only a matter of finding the right function for the purpose on the WordPress Codex ^_^ – gloria Jul 31 '16 at 1:14
  • 1
    It sure could be done with some type of counter, or comparing the count of the two loops and taking measures at that moment. Note that my answer was first designed to make an easy job of outputting some info like a title or a title with link to article. The way it is now, like jgraup has pointed, is becoming somewhat heavy :) Might be much simpler to just go the two queries road instead of this as-many-queries-as-there-are-posts. My method is lightweight as long as you store data from the query in the array, much less when you store IDs, and make a bunch of new queries with each. – gloria Aug 1 '16 at 0:50
2

Run through the loop with % for the left side first, then rewind the loop and start in on the right side.

https://codex.wordpress.org/Function_Reference/rewind_posts

Update:

Based on the answer you selected that stores the ID in two different arrays, then loops through those IDs again per side - you might want to consider reducing the loops by only storing the resulting output into two separate strings.

ob_start() will capture the output buffer, do your visual logic and $<side> .= ob_get_clean() will append the data.

When your loop is finished you only need to echo "<div>$left</div><div>$right</div>";

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.