Hello,

I am using Wordpress 3.7 and have been using the following code to display a list of posts in a category (for example in my category page called "category-sport.php"). The code displays for example 5 posts in two columns which is exactly what I want (I am using bootstraps "span4" div class to achieve 2 columns)

But, I would like to display the first post from the category in a "featured" style single column (bootstrap div class span8) ABOVE the two columns.

How do I achieve this?

Here is my code to display posts in two columns -

PHP Code:
<?php
$num_cols 
2// set the number of columns here
//the query section is only neccessary if the code is used in a page template//
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1// for pagination
$args = array(
'posts_per_page' => 16// optional to overwrite the dashboard setting
'cat' => 6// add any other query parameter to this array
'paged' => $paged
);
query_posts($args);
//end of query section

if (have_posts()) : for ( $i=$i <= $num_cols$i++ ) : echo '<div id="col-'.$i.'" class="span4">';
$counter $num_cols $i;
while (
have_posts()) : the_post();
if( 
$counter%$num_cols == ) : ?>
<!-- core post area - title, content, thumbnails, postmeta, etc -->
<div id="post-<?php the_ID(); ?>" class="post row-<?php echo ($row%2); ?>">
<!-- start of anything to do with post -->
<h2>
<a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h2>
<div class="storycontent">
<?php the_excerpt(__('(more...)')); ?>
</div>
<!-- end of anything to do with post -->
</div> <!-- end #post -->

<?php endif;
$counter++;
endwhile;
rewind_posts();
echo 
'</div>'//closes the column div
endfor;
next_posts_link('&laquo; Older Entries');
previous_posts_link('Newer Entries &raquo;');
else:
echo 
'no posts';
endif;
wp_reset_query();
?>