I'm attempting to create a posts with the first page having a feature post followed by rows of 3 columns of posts.
First page
|---------------Feature Post---------------|
|----Post----| |----Post----| |----Post----|
|----Post----| |----Post----| |----Post----|
Then for the second page to just be rows of 3 columns
|----Post----| |----Post----| |----Post----|
|----Post----| |----Post----| |----Post----|
I have the following code setup which at the moment doesn't seem to differentiate between the first page of results and the second page of results as it seems to recalculate the counter back to 0 on the second page.
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'post_type' => 'post',
'post_status' => 'publish',
'posts_per_page' => 4,
'paged' => $paged,
'prev_next' => true,
);
$wp_query = new WP_Query($args);
if( $wp_query->have_posts() ) {
$counter = 0;
while ($wp_query->have_posts()) {
$wp_query->the_post();
echo $counter
?>
<?php if ( 0 === $counter ) { ?>
<div class="row">
<div class="col-12">
======First article here=====
</div>
</div>
<?php } else { ?>
<?php if($counter % 3 === 0) { ?>
<div class="row">
<?php } ?>
<div class="col-md-4 news-grid__article">
===== All other articles here =====
</div>
<?php $counter++;
if($counter != 0 && $counter % 3 == 0) { ?>
</div>
<div class="clearfix"></div>
<?php } ?>
<?php } $counter++; ?>
<?php } } ?>
<div class="news-pagination">
<?php
echo paginate_links( array(
'prev_next' => true
) );
?>
</div>
Any idea why the counter resets to 0 on the second page of results? I believe this would solve my issue and show the layout required.