Breaking a wordpress loop, then re-entering after inserting a div

I’m building a WordPress theme based around Twitter Bootstrap. With Bootstrap’s responsive layout .row-fluid spans 100% of the page and can have 12 ‘spans’ within one row.

<div class="row-fluid">
    <?php query_posts('category_name=feature-articles&showposts=6'); ?> 
    <?php while (have_posts()) : the_post(); ?>

        <div class="span4">
        <div class="main-thumb"><?php echo get_the_post_thumbnail(($page->ID) , 'main-thumb'); ?></div>
        <a href="<?php the_permalink(); ?>"><h3 class="title"><?php the_title(); ?></h3></a>
        <p class="excerpt"><?php
            $my_excerpt = get_the_excerpt();
            if ( $my_excerpt != '' ) {
                // Some string manipulation performed
            }
            echo $my_excerpt; // Outputs the processed value to the page
            ?></p>


    <?php endwhile; ?></div>

This creates 6 “span4”, which I want to span across 2 different rows – but because of the loop, there’s no way to close the original .row-fluid div and open another after 3 posts have been created.

Read More

For simplicity’s sake, I want to get posts 1, 2 and 3, then close the .row-fluid div and create another, then get posts 4, 5 and 6. Is this possible with a bit of loop manipulation?

Related posts

Leave a Reply

1 comment

  1. You’d have to put a counter in the loop, and when it reaches 3, add a close/open tag. I’ve also added if(have_posts()) to the start of your loop, to avoid errors (also allows you to output a message if there are no posts).

    <div class="row-fluid">
    
        <?php $i = 0 ?>
        <?php query_posts('category_name=feature-articles&showposts=6'); ?>
        <?php if(have_posts()) : while (have_posts()) : the_post(); ?>
    
            <?php if( $i == 3 ) : ?>
                </div>
                <div class="row-fluid">
            <?php endif; ?>
    
            <div class="span4">
    
            <div class="main-thumb">
                <?php echo get_the_post_thumbnail(($page->ID) , 'main-thumb'); ?>
            </div>
            <a href="<?php the_permalink(); ?>">
                <h3 class="title"><?php the_title(); ?></h3>
            </a>
            <p class="excerpt">
    <?php
                $my_excerpt = get_the_excerpt();
                if ( $my_excerpt != '' ) {
                    // Some string manipulation performed
                }
                echo $my_excerpt; // Outputs the processed value to the page
    ?>
            </p>
    
            <?php $i++ ?>
    
            <?php endwhile; ?>
        <?php endif; ?>
    
    </div>