I’ve built this theme by using two separate loops, one displaying only the first post on the first page, and the other is offseted by 1 and displays 12 posts on all pages. I tried dealing with the mess that offsetting does to the pagination but the solution I came up with is half-assed, so I want to try something different. I want to use single loop for both groups so I need to be able to break out of the loop after the first post to insert the wrapper for the 12 posts group and then continue the loop after that. Rest of the pages need to display only next 12 posts from the second group. So to be clear, I need the first page do display 13 posts in total (first + next 12), and the subsequent pages only the next 12. Inside the code I came up with I wrapped the first post in $custom_query->current_post == 0 && !is_paged()){ and here I also included the wrapper div for the second group since this is executed only once. Then I continued the loop after
$is_wrapped = 1;
}
if($custom_query->current_post >= 1){
This works for the first page but since it is only executed on the first page it deletes the wrapper on subsequent pages, which breaks the layout.
this is the full code I came up with so far:
<main>
<?php
//latest posts
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args= array(
'paged' => $paged,
'posts_per_page' => 13,
);
$custom_query = new WP_Query($args);
?>
<?php if ($custom_query->have_posts()) : while ($custom_query->have_posts()) : $custom_query->the_post(); ?>
<?php if( $custom_query->current_post == 0 && !is_paged()){ ?>
<article class="featured-article">
<div class="featured-thumbnail">
<?php
if ( has_post_thumbnail() ) { ?>
<figure>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail('thumbnail'); ?>
<figcaption><span>Read more</span></figcaption>
</a>
</figure>
<?php
}
?>
</div>
<div class="featured-excerpt">
<p class="article-meta"><?php include (TEMPLATEPATH . '/inc/meta.php' ); ?></p>
<h2 class="article-title"><?php the_title(); ?></h2>
<?php $limit = 40; ?>
<p class="article-excerpt"><?php echo wpse_custom_excerpts($limit); ?></p>
<a href="<?php the_permalink(); ?>" class="learn-more">Read more</a>
</div>
</article>
<hr class="small-article-divider stage-divider">
<div class="latest-posts">
<?php
$is_wrapped = 1;
}
if($custom_query->current_post >= 1){
?>
<article class="small-article" role="article">
<p class="article-meta"><?php include (TEMPLATEPATH . '/inc/meta.php' ); ?></p>
<?php if ( has_post_thumbnail() ) : ?>
<figure>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail('thumbnail'); ?>
<figcaption><span>Read more</span></figcaption>
</a>
</figure>
<?php endif; ?>
<h2 class="article-title"><?php the_title(); ?></h2>
<?php $limit = 40; ?>
<p class="article-excerpt"><?php echo wpse_custom_excerpts($limit); ?></p>
<a href="<?php the_permalink(); ?>" class="learn-more">Read more</a>
</article>
<hr class="small-article-divider">
<?php }
endwhile; endif;?>
<?php if (!empty($is_wrapped)){ ?>
</div><!-- should be only once -->
<?php } ?>
<?php include (TEMPLATEPATH . '/inc/nav.php' ); ?>
</main>
After dealing with this for countless hours my brain is slowly starting to hurt and I cant think straight anymore so can someone help me fix this and come up with the way to display 13 posts on the first page and 12 on subsequent pages.
