the_loop inside row and cols (for purists)
-
On a category page, I want to loop my (paged) posts inside the rows and cols of a grid system. A simplified version of 2 cols per row looks like this:
<div class="row"> <div class="col span_6"></div> <div class="col span_6"></div> </div> <div class="row"> <div class="col span_6"></div> <div class="col span_6"></div> </div> ...
To do this I wrote this code:
<div class="row"> <?php $postcounter = 0; /* Start the Loop */ while ( have_posts() ) : the_post(); echo '<div class="col span_6">*content here*</div>'; $postcounter++; if(($postcounter != 10) && (!($postcounter&1))){ echo '</div><div class="row">'; } endwhile; ?> </div><!-- close row -->
This works.
The second part of the if-statement checks $postcounter even or odd. If even, the row is closed and a new row is opened.
The first part of the if-statement checks if this is the 10th post ( = post_per_page ). If it is the 10th post, the close-open row isn’t included as the already open row will get closed by the last rule of this code example.This works but suppose a category with 12 posts, second paged page. This one will show 2 posts. However – and here we come to my problem – the code will look like this:
<div class="row"> <div class="col span_6"></div> <div class="col span_6"></div> </div> <div class="row"></div> ...
Ending with an empty row because the if-statement will fail and add the end-begin-row code. (the 12th post being even but not $postcounter == 10)
Any way around this?
- The topic ‘the_loop inside row and cols (for purists)’ is closed to new replies.