CODEWITHSUNDEEP
wordpress
Phil
Phil

Reputation: 27

How do I display the second and third most recent posts from a category in WordPress

I am displaying previews of the three most recent news articles on my homepage. The most recent post will be displayed in a different format to the second and third most recent posts. I am currently displaying all three the same with the following code

<?php query_posts('cat=2 && showposts=3'); 
                    if (have_posts()) : while (have_posts()) : the_post(); ?>
                        <div class="col-xs-12 col-sm-4">
                            <div class="column">
                                <div class="news-article">
                                    <p class="news-date"><?php the_time( get_option( 'date_format' ) ); ?></p>
                                    <a href="<?php the_permalink(); ?>">
                                        <?php if ( has_post_thumbnail() ) { the_post_thumbnail('full', array( 'class' => 'img-responsive img-rounded news-img' )); } ?>
                                        <p class="news-headline"><?php the_title(); ?></p>
                                    </a>
                                    <p><?php the_excerpt(); ?></p>
                                    <a href="<?php the_permalink(); ?>">
                                        <p class="pull-right">Read more...</p>
                                    </a>
                                    <span class="clearfix"></span>
                                </div>
                            </div>
                        </div>
                    <?php
                    endwhile;
                    endif;
                    ?>

How can I add another loop which will separate the second and third most recent posts from the most recent post? I did not want to use postID as the posts will change.

Upvotes: 0

Views: 4266

Answers (3)

C-Dev
C-Dev

Reputation: 462

I use WP_Query like this to show all posts from the fourth most recent one:

<?php
    $query4 = new WP_Query( 'posts_per_page=4&offset=3' );
?>

Upvotes: 0

JacobStephens
JacobStephens

Reputation: 31

The two arguments in the WP_Query function below combine to retrieve the second most recent post, then the HTML below displays that post.

<div class="video-message">
  <p>
  <ul>
  <!-- // Define our WP Query Parameters -->
  <?php 
  $the_query = new WP_Query( array( 'posts_per_page' => 1,'offset' => 1 ) ); 
  ?>

  <!-- // Start our WP Query -->
  <?php while ($the_query -> have_posts()) : $the_query -> the_post(); ?>

  <!-- // Display the Post Title with Hyperlink -->
  <p><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></p>

  <?php 
  endwhile;
  wp_reset_postdata();
  ?>
  </ul>
  </p>
 </div> 

</div>

To display the third most recent post would require changing the offset value to 2, so that the program skips over the two most recent posts.

$the_query = new WP_Query( array( 'posts_per_page' => 1,'offset' => 2 ) );

This method is discussed in the Pagination Parameters section of the WordPress Code Reference.

Upvotes: 2

Howli
Howli

Reputation: 12469

Untested but you could try:

    <?php 
    $count = 0;
    query_posts('cat=2 && showposts=3'); 
    if (have_posts()) : while (have_posts()) : the_post(); 
    if($count == 0)
    {
    ?>
        <div class="col-xs-12 col-sm-4">
            <div class="column">
                <div class="news-article">
                    <p class="news-date"><?php the_time( get_option( 'date_format' ) ); ?></p>
                    <a href="<?php the_permalink(); ?>">
                    <?php if ( has_post_thumbnail() ) { the_post_thumbnail('full', array( 'class' => 'img-responsive img-rounded news-img' )); } ?>
                    <p class="news-headline"><?php the_title(); ?></p>
                     </a>
                     <p><?php the_excerpt(); ?></p>
                    <a href="<?php the_permalink(); ?>">
                    <p class="pull-right">Read more...</p>
                    </a>
                    <span class="clearfix"></span>
                </div>
            </div>
        </div>
    <?php
    $count = 1;
    }
    else
    {
        //Some other layout here
    }
    endwhile;
    endif;
    ?>

The above will check if $count is 0 and if it is, then do the layout and the count will then equal to 1. So the next time around $count won't be 0, so it will run what is in the else (which will be your layout).

Upvotes: 0

Related Questions