Question

<?php get_header(); ?>
<div class="page-wrap group">

<div class="grid">

  <?php query_posts('showposts=6'); ?>

    <?php if (have_posts()): ?>

  <section class="blog-posts col-2-3 grid-pad">

    <?php while (have_posts()) : the_post(); ?>

      <article class="module" id="post-<?php the_ID(); ?>">

        <h2> <a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a </h2>
        <p><time datetime="2001-05-15 19:00"><?php echo date('l jS F Y')?></p>

        <?php the_excerpt(); ?>


      </article>

      <?php endwhile; ?>

  </section>

This is my code for the index.php, what I want to do is have lets say 3 blog posts in <section class="blog-posts col-2-3 grid-pad"> then another 3 posts in <section class="blog-posts col-2-3 grid-pad">

So how do you loop the posts so you can have them spread across the page? Right now I can only get it so it displays them all in the first

Answer 1

Simply use a counter variable:

<?php if (have_posts()): ?>

  <section>

  <?php $i = 0; while (have_posts()) : the_post(); ?>

      <article>
      ...
      <article>

  <?php if(++$i === 3): // close previous and open new one ?>
  </section>

  <section>
  <?php endif; ?>      

  <?php endwhile; ?>
  </section>    

<?php endif; ?>

Or you can perform two queries with the WP_Query class, with the posts_per_page=3 argument, and the offset=3 argument on the 2nd query.

---

To change the number of posts displayed on your page, add this to your functions file:

add_action('pre_get_posts', function($query){

  if(is_admin() || !$query->is_main_query())
    return;

  if(is_home()) // or whatever page you want the limit applied to
    $query->set('posts_per_page', 6);

});