Build a content and excerpt grid loop with paging and options for # of posts

by

What I’d like to do: on index.php, a loop that shows a selectable number of full posts using the_content and then below that shows a selectable number (the number of posts can be hardcoded in the function) of excerpts (using the_excerpt) in a grid pattern 2 excerpts wide. Any paged page of posts only uses the grid display of excerpts. Like this:

index post display

paged post display

This loop would be ideal if it handled text and excerpts and content rather than images: http://www.billerickson.net/a-better-and-easier-grid-loop/

Yet Another Update 11/03/12:

Thanks to kaiser for this. One last bug: the second page shows the 2 full posts and excerpts rather than all excerpts.

    global $wp_query;
    if ( have_posts() )
    {
        while( have_posts() )
        {
            the_post();

            // Add Class: "post-number-X"
            $current_post = "post-number-{$wp_query->current_post}";

            // Add Class: "home" (for index page) or "post-number-X-of-total";
            $current_in_total="home";
            if ( is_paged() )
            {

                $current_in_total  = "post-number-";
                $current_in_total .= get_query_var( 'paged' ) * get_query_var( 'posts_per_page' ) - $wp_query->current_post;
                $current_in_total .= "-of-total";
            }

            // Add Class: Even/Odd
            $even_odd = ( 0 === $GLOBALS['wp_query']->current_post % 2 ) ? ' even' : ' odd';
            // Avoid even/odd class for excerpts (everything after the 2nd post)
            2 > $wp_query->current_post AND $even_odd = '';

            // MarkUp: Uses `post_class()` to add classes
            ?>
     <article <?php post_class( "{$current_post}{$even_odd} {$current_in_total}" ); ?>>
                <h3><a href="https://wordpress.stackexchange.com/questions/70792/<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
                <?php 
                // Home/Index/Front-Page/Archive first page
                if ( ! is_paged() )
                {
                    // Display the_content(); for the first 2 posts, then the_excerpt();
                    2<= $wp_query->current_post ? the_excerpt() : the_content();
                }
                // Paged archives (starts at second page)
                else
                {
                    the_excerpt();
                }
                ?>
            </article>
            <?php
        } 

// Add navigation ...
    twentyeleven_content_nav( 'nav-below' );

    } // endif;
    unset( $current_post, $current_in_total, $even_odd );

2 Answers
2

The $wp_query properties allow “alot”

Actually it’s not that hard if you use parts of the $wp_query object like current_post.

Here you can see some examples that make some tricky use of things like is_paged(), $wp_query->current_post and $wp_query->posts_per_page. You can switch MarkUp depending on if you’re on the first or later pages, if you got the first three (or whatever number) or later posts. It’s also nice to use the post_class() function, which also has a filter named post_class() – it has three arguments: The $classes (default WP core classes), the $class (an array of classes you defined while calling it – see below example) and the $post_ID.

global $wp_query;
if ( have_posts() )
{

    // Add navigation ... TOP
    twentyeleven_content_nav( 'nav-above' );

    while( have_posts() )
    {
        the_post();

        // Add Class: "post-number-X"
        $current_post = "post-number-{$wp_query->current_post}";

        // Add Class: "home" (for index page) or "post-number-X-of-total";
        $current_in_total="home";
        if ( is_paged() )
        {

            $current_in_total  = "post-number-";
            $current_in_total .= get_query_var( 'paged' ) * get_query_var( 'posts_per_page' ) - $wp_query->current_post;
            $current_in_total .= "-of-total";
        }

        // Add Class: Even/Odd
        $even_odd = ( 0 === $GLOBALS['wp_query']->current_post % 2 ) ? ' even' : ' odd';
        // Avoid even/odd class for excerpts (everything after the 3rd post)
        3 > $wp_query->current_post AND $even_odd = '';

        // MarkUp: Uses `post_class()` to add classes
        ?>
        <article <?php post_class( "{$current_post}{$even_odd} {$current_in_total}" ); ?>>
            <h3><a href="https://wordpress.stackexchange.com/questions/70792/<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
            <?php 
            // Home/Index/Front-Page/Archive first page
            if ( ! is_paged() )
            {
                // Display the_content(); for the first 3 posts, then the_excerpt();
                3 <= $wp_query->current_post ? the_excerpt() : the_content();
            }
            // Paged archives (starts at second page)
            else
            {
                the_excerpt();
            }
            ?>
        </article>
        <?php
    }

    // Add navigation ... BELOW
    twentyeleven_content_nav( 'nav-below' );

} // endif;
unset( $current_post, $current_in_total, $even_odd );

Leave a Comment