Wrapping WordPress Posts After X Amount of Times, Without Modifying Loop? - php

Question

I have a WordPress starter theme and one of the features is the ability to chose different archive formats by selecting different template parts. My index.php essentially looks like this:
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<!-- To see additional archive styles, visit the /parts directory -->
<?php get_template_part( 'parts/loop', 'archive' ); ?>
<?php endwhile; ?>
<?php joints_page_navi(); ?>
<?php else : ?>
<?php get_template_part( 'parts/content', 'missing' ); ?>
<?php endif; ?>
One of the archive formats is a grid format, which essentially needs to output like so:
Start Row
Post 1
Post 2
Post 3
End Row
Start Row
Post 4
Post 5
Post 6
End Row
.....
Normally, I use this method:
<?php foreach (array_chunk($posts, 2, true) as $posts) : ?>
<div class="row">
<?php foreach( $posts as $post ) : setup_postdata($post); ?>
<div class="six columns">
<?php the_content(); ?>
</div>
<?php endforeach; ?>
</div>
<?php endforeach; ?>
However, that piece of code requires a different type of loop than the standard WP loop, which makes it hard to integrate into the theme without the user having to also make adjustments to the loop.
So my question is, is it possible to wrap X amount of posts with a div without modifying the standard WordPress loop?

Answer 1

You can start iterating (counting) over posts by using the iterator $i;
In your archive.php or index.php (the file which has the main query):
<?php if (have_posts()) :
$i = 1; //Start counting
while (have_posts()) : the_post(); ?>
<!-- To see additional archive styles, visit the /parts directory -->
<?php get_template_part( 'parts/loop', 'archive' ); ?>
<?php $i++; //Increase $i ?>
<?php endwhile; ?>
<?php joints_page_navi(); ?>
<?php else : ?>
<?php get_template_part( 'parts/content', 'missing' ); ?>
<?php endif; ?>
And in your parts/loop file (which has the loop "<article></article>"), make calculations to check the current post index and decide whether to skip, start or close the wrapper tag:
<?php
//Doing some math
$x = 4 //Change this to any number you want
if ( $i == 1 || $i == $x || $i % $x == 1 ) {
$before_article = '<div class="wrapper">'; //The wrapper start tag
}
if ( $i % $x == 0 || $wp_query->current_post + 1 == $wp_query->post_count ) {
$after_article = '</div>'; //The wrapper end tag
}
<?php echo $before_article; ?>
<article>
<!-- post content here -->
</article>
<?php echo $after_article; ?>
<?php $before_article = ''; $after_article = ''; ?>