Wordpress custom loop posts

Question

I want to make a post page in the category.php template. I want the first post to be a block of 600px by 600px and then 4 posts next to that of all 295px by 295px and the row under that first 4 blocks and than 1 big block etc. So it will look like this:

can this be achieved with the

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

loop?

Thanks.

Answer 1

Yes. You just need to keep track of whether the big image is on the left or right, and have a count running to tell you which post you're on in the grid/row...and then a way to close out the div tags when the loop is over. Something along these lines:

<?php
$big_left = true;
$items_displayed_in_this_row = 0;
while( have_posts() ){
  if( $big_left ){
    if( 0 == $items_displayed_in_this_row ){
      // Code to put the big image on the left
      the_post();
    } else {
      // Code to put the small images on the right
      the_post();
    }
  } else {
    if( 4 == $items_displayed_in_this_row ){
      // Code to put the big image on the right
      the_post();
    } else {
      // Code to put the small images on the left
      the_post();
    }
  }
  $items_displayed_in_this_row++;
  if( 5 == $items_displayed_in_this_row ){
    if( $big_left ){
      $big_left = false;
    } else {
      $big_left = true;
    }
    $items_displayed_in_this_row = 0;
  }
}
// While loop just ended. Close out whatever divs might be open.
// eg, if $items_displayed_in_this_row > 0, you're in the middle of a row
// and should close it.

?>

No matter what, it's going to be long and ugly. But doing it in the main loop like this instead of a custom query will allow you to take advantage of pagination, prev/next, etc.

Answer 2

Yeah, you can do this, but you'll want to look at get_posts instead. Check out the examples there, they'll give you something to work with.