WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I want to show first post wider than other posts on the index page of my wordpress theme like firstpost.com.

Please suggest me how to do this?

share|improve this question
what theme are you using? – Michael Sep 26 '11 at 10:29
I am using yoko theme – Neha Sep 27 '11 at 8:48
How about a link to the theme? Please edit your question and add as much detail as you got. – kaiser Aug 30 '12 at 13:09

you create a variable that holds the count of the loop. then with every iteration you increment this variable.

in your loop you can check for the first post to do something else then the rest of the posts, assign a different css class for example.

// create var for count
$count = 0;

// do your loop & increment the var
if (have_posts()) : while (have_posts()) : the_post(); $count++;

if ($count === 1) :
// do code for only the first post...

// do code for the rest of your posts...

// end loop
endwhile; endif;
share|improve this answer
You can also use a built in function after the loop starts to count posts using $count_posts = $your_wp_query->current_post + 1 – Wyck Sep 27 '11 at 0:25
Thanks DAAN and Wyck – Neha Sep 27 '11 at 8:51

when you start loop take one variable $i=1; and increament this variable with 1 everytime loop is running

now you've to check if $i=5 or $i=10 (the number of post you want) then write css for wide post else normal like all posts

If you've little bit looping knowledge then this one is the easiest way.

share|improve this answer
I am a learner, so do not have much knowledge about loop. It would be nice if you can provide me code. – Neha Sep 26 '11 at 10:02

one possible way: edit index.php of yoko; find this section:

<div id="wrap">
<div id="main">

and add this code inbetween:

<?php if( is_home() && !is_paged() ) : ?>
<div id="full-top"  class="content">
    <?php the_post(); ?>

    <?php get_template_part( 'content', get_post_format() ); ?>
<?php endif; //end of if( is_home() && !is_paged() ) // ?>

full code of edited index.php: http://pastebin.com/WFKzuQXa

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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