I'm having a difficult time writing out the PHP for this magazine layout I'm making.

Here's the prototype: http://socalnpo.org

Here's what I currently have: http://socalnpo.org/wp

The first 3 are the most recent (left to right) and the next 6 are the older ones. They all go in reverse chronological order.

I'm not sure how to write the PHP for the loop because it's definitely not like a basic post.

Here's what I have so far, but there really isn't much for PHP because I didn't know where to start.

<a href="<?php the_permalink() ?>" rel="bookmark">
if ( has_post_thumbnail() ) {
<h1><a href="<?php the_permalink() ?>" rel="bookmark">
<?php the_title(); ?></a></h1>
<?php the_excerpt(); ?></div>
<?php endwhile; ?>

I just need some help in the right direction to be able to do this, since I've been stuck on this for days.

I was hoping there would be a way to isolate the last 9 individual posts so that I can force them into their own <div> to make it a little easier, even though it will be more tedious.

Let me know what you think!

Any help will be greatly appreciated! :)


2 Answers 2


There is no reason to need 2 loops or to alter the query in any way if your are just showing the 9 most recent posts. You can use a loop counter to create the extra divs you need.

<div id="featured">
<?php $count = 0;
if (have_posts()) : while (have_posts()) : the_post();
    if ( $count < 4 )  { //display of first 3 posts ?>
        <div id="featured-<?php echo $count; ?>">

        <?php //do stuff here ?>
    <?php }

if ( $count == 4 ) { //closes the featured div adds the links in the center then opens the columns div ?>
    </div> <!-- /close the featured div -->
        <div id="recent">
              <li>Recent News</li>
              <li>View more news...</li>
<div id="columns">
<?php }
    if ( $count > 3 && $count < 10 ) { //Next 6 posts ?>

        <div id="recent-<?php echo $count - 3 ?>">

        <?php //do stuff here ?>
<?php }

     endwhile; endif; ?>
</div> <!-- /end columns -->

You need to make sure reading settings are set to show 9 posts per page or create a new wp_query with posts_per_page set to 9.

The $count variable will determine how the post is displayed as WordPress goes through the loop. When $count = 4 we show the extra divs and html you need in the middle of the page.

  • THANK YOU SO MUCH, Chris!!! I finally got it to work on my layout. I'm so surprised that you got the counts to work with my id names, too. This is is really great and you have my deepest gratitude. Going out of your way to help noobies like me really keeps me motivated to keep trying and being persistent even when it gets annoying from hitting a wall. Thanks again!! Wishing you all the best. :) --Dana
    – DanaOira
    Commented Dec 9, 2011 at 21:05
  • You have syntax errors. You have an unclosed echo on line 10 and you have <?php tags inside echo statements.
    – Chris_O
    Commented Dec 9, 2011 at 21:06

It looks to me like the best way to do this is to use two separate loops. You can use the default loop for the first three, then create another loop for the "Recent News." What you have so far will work for the default loop, assuming you have while (have_posts()) : to start the loop before your first tag begins. For the second loop you could do something like

    <?php global $post;
    $args = array('tag' => 'featured');
    $custom_posts = get_posts($args);
    foreach($custom_posts as $post) : setup_postdata($post);
    // insert your title, excerpt, post thumbnail code here

Essentially, this will grab whatever posts you tag as "featured" and throw them in that div. If you'd like to grab the posts by some other logic, check out the codex page on wp_query. This is better than just grabbing the most recent posts because then you can feature any posts in that div that you tag as featured.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.