Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I'm trying to create a magazine style website. For this particular page (not homepage) I'd like to fetch the latest post and style it one way (style1). For all the other posts I'd like to just display smaller (style2).

This is working fine, BUT I would also like to enable pagination. Is there anyway to have pagination appear at the bottom, when the user clicks previous older posts will be shown in the second style (style2)?

My code so far is below:

<?php 
/*
Template Name: Interview
*/
get_header(); ?>
<div id="content" class="wrapper">

<div id="main" class="post">
<ul id="latest-feature">
<h3>Interviews</h3>
<?php
    $args=array(
    'cat' => '12,3',
    'post_type' => 'post',
    'post_status' => 'publish',
    'posts_per_page' => 3,
    'caller_get_posts'=> 1
    );
    $my_query = null;
    $my_query = new WP_Query($args);
    while ($my_query->have_posts()) : $my_query->the_post(); 

    $counter++;
    if($counter===1) {
?>

<li class="main-box">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'slider-image' );  } ?>

<h4><?php the_title(); ?></h4></a>
<span><?php the_time('j M') ?> | <?php comments_number('No Comments', 'One Comment', '% Comments' );?></span>

<?php my_excerpt(40); ?>

</li>
</ul>
<ul id="other-features">
<?php } else { ?>
<li class="box">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
<span class="box-img">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'latest-thumb-small' );  } ?>
</span>
<div class="box-content">
<h4>
<?php the_title(); ?></a>
</h4>
<span><?php the_time('j M') ?> | <?php comments_number('No Comments', 'One Comment', '% Comments' );?></span>
<?php my_excerpt(30); ?>
</div>
</li>
<?php } ?>

<?php endwhile; ?>

<?php next_posts_link('&laquo; Older Entries', $my_query->max_num_pages) ?>
<?php previous_posts_link('Newer Entries &raquo;') ?>

</ul>
</div>
</div>
<?php get_sidebar(); ?>
</div>
<?php get_footer(); ?>

TL;DR: Ideally I want to:

  1. Display the latest post as style1
  2. Display all the other posts as style2
  3. When the user clicks NEXT/PREVIOUS, load more posts and style them as style2. Unless they are on the latest post page.

UPDATED CODE;

<?php 
/*
Template Name: Film
*/
get_header(); ?>
        <div id="content" class="wrapper">

            <div id="main" class="post">

<ul id="latest-feature">
<?php 

// Only on the first page
if ( ! is_paged() ) {

    // Custom query - latest post
    $latest_post = new WP_Query( array(
        'cat' => '4',
        'post_type' => 'post',
        'post_status' => 'publish',
        'posts_per_page' => 1
    ) );
    // Output latest post
    if ( $latest_post->have_posts() ) : while ( $latest_post->have_posts() ) : $latest_post->the_post();
        ?>

<li class="main-box">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'slider-image' );  } ?>

<h4><?php the_title(); ?></h4></a>
<span><?php the_time('j M') ?> | <?php comments_number('No Comments', 'One Comment', '% Comments' );?></span>

<?php my_excerpt(40); ?>
</li>
</ul>
<ul id="other-features">
<?php 
    endwhile; endif;
    // Don't forget me
    wp_reset_postdata();

}

// Main query
if ( have_posts() ) : while ( have_posts() ) : the_post();
?>

           <li class="box">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
<span class="box-img">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'latest-thumb-small' );  } ?>
</span>
<div class="box-content">
<h4>
<?php the_title(); ?></a>
</h4>
<span><?php the_time('j M') ?> | <?php comments_number('No Comments', 'One Comment', '% Comments' );?></span>
<?php my_excerpt(30); ?>
</div>
</li>
<?php 
endwhile; endif;
?>
</ul>
<?php 
// Pagination
next_posts_link();
previous_posts_link();

?>
</div>
            </div>
            <?php get_sidebar(); ?>
        </div>
<?php get_footer(); ?>

Functions:

function wpse121486_pre_get_posts( $query ) {
        // Main blog posts index, first page, main query
        if ( is_home() && ! $query->is_paged() && $query->is_main_query() ) {
            $query->set( 'posts_per_page', 9 );
            $query->set( 'offset', 1 );
        }
    }
    add_action(

 'pre_get_posts', 'wpse121486_pre_get_posts' );
share|improve this question

2 Answers 2

Edit

So, the reason that this isn't working is because you've modified the question to specify that this is happening in a custom page template. Since this is the case, you'll need to use two separate custom queries, and won't need to bother with filtering the main query via pre_get_posts.

The first query will be the same as below. The second will be similar, but we'll add some conditionals in to account for the featured post on the first page:

// Main posts query args
$posts_query_args = array(
    'posts_per_page' => 10
);

// Conditionally modify the query
if ( ! is_paged() ) {
    // Apply offset
    $posts_query_args['offset'] = 1;
    $posts_query_args['posts_per_page'] = 9;
}

// Run the query
$posts_query = new WP_Query( $posts_query_args );

// Loop
if ( $posts_query->have_posts() ) : while ( $posts_query->have_posts() ) : $posts_query->the_post();
    // Loop markup here
endwhile; endif;
// Reset post
wp_reset_postdata();

To get pagination working properly, you'll need to refer to this answer.

Original Answer

I think the easiest solution would be:

  1. Use a custom query for the single, latest post
  2. Filter the main query at pre_get_posts, to apply an offset of 1

This method will assume that the latest post special styling will happen only on the first page; on subsequent pages, posts will all use the normal style. Otherwise, we'd have to add an extra fix to account for broken pagination due to our use of offset.

In the template:

// Only on the first page
if ( ! is_paged() ) {

    // Custom query - latest post
    $latest_post = new WP_Query( array(
        'posts_per_page' => 1
    ) );
    // Output latest post
    if ( $latest_post->have_posts() ) : while ( $latest_post->have_posts() ) : $latest_post->the_post();
        // Style 1 loop
    endwhile; endif;
    // Don't forget me
    wp_reset_postdata();

}

// Main query
if ( have_posts() ) : while ( have_posts() ) : the_post();
    // Style 2 loop
endwhile; endif;

// Pagination
next_posts_link();
previous_posts_link();

In functions.php:

function wpse121486_pre_get_posts( $query ) {
    // Main blog posts index, first page, main query
    if ( is_home() && ! $query->is_paged() && $query->is_main_query() ) {
        $query->set( 'posts_per_page', 9 );
        $query->set( 'offset', 1 );
    }
}
add_action( 'pre_get_posts', 'wpse121486_pre_get_posts' );
share|improve this answer
    
I'll definitely try this in the morning! I'll let you know how it goes, thank you! –  DavidPottrell Nov 6 '13 at 23:04
    
No luck unfortunately, I insert the query at the top and add the code to functions.php - It retrieves the first post fine but doesn't retrieve the style 2 posts –  DavidPottrell Nov 7 '13 at 12:33
    
Forgot to add the offset. Also: please edit your question to include the full code you've tried, to provide context to "no luck unfortunately". There might be something else in your loop code that's causing a problem. –  Chip Bennett Nov 7 '13 at 12:59
    
I've added your code to the main question now, right now, with the latest code it retrieves the style1 post, but nothing else? I'm probably missing something obvious though... –  DavidPottrell Nov 7 '13 at 21:01
    
Can we see the live-rendered output? It literally retrieves nothing else? Also: this is now a custom page template? That's a critical difference, that you sneaked into the question earlier. That's why it's not working. –  Chip Bennett Nov 7 '13 at 21:09

You can include in your conditional is_paged() to determine if you are past page 1.

So, example:

while ($my_query->have_posts()) : $my_query->the_post(); 
    $counter++;
    if($counter===1 && !is_paged()) {
        // do first-post stuff
    } else {
        // do other stuff
    }
endwhile;
share|improve this answer
    
I did originally have something like this, but for some reason clicking Previous would just change the style of the same posts. Posts 1 2 3 are always displayed for some reason. –  DavidPottrell Nov 6 '13 at 22:57

Your Answer

 
discard

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.