Thumbnail (featured image) of next and previous post is not being properly displayed!

I’m using this code to display the thumbnail (featured picture) of the previous and next post (a custom post type called Blocks).

(A custom loop)

Read More
<?php // Create and run custom loop
    $custom_posts = new WP_Query();
    $custom_posts->query('post_type=blocks&location=Front Page&section=Mainbar');
    while ($custom_posts->have_posts()) : $custom_posts->the_post();
?>  <div class="block-2 border-top">
        <h2><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
<?php endwhile; ?>

    <?php // Display previous and next posts thumbnails     
    ?>  <div class="float-left"> <?php
            $prevPost = get_previous_post();
            $prevthumbnail = get_the_post_thumbnail($prevPost->ID);
            previous_post_link('%link', $prevthumbnail);
    ?>  </div>

    <?php // Get thumbnail of next post
    ?>  <div class="float-right"> <?php
            $nextPost = get_next_post();
            $nextthumbnail = get_the_post_thumbnail($nextPost->ID);
            next_post_link('%link', $nextthumbnail);
    ?>  </div>
    </div>

This is the chronology:

enter image description here

And this is the output:

  <div class="block-2 border-top">
            <h2><a href="http://localhost/wpac/?blocks=mainbar" title="Permalink to Mainbar" rel="bookmark">Mainbar</a></h2>

          <div class="float-left"> <a href="http://localhost/wpac/?blocks=mainbar-left" rel="prev"><img width="160" height="150" src="http://localhost/wpac/wp-content/uploads/2011/02/showcase2.png" class="attachment-post-thumbnail wp-post-image" alt="showcase2" title="showcase2" /></a>  </div>

          <div class="float-right"> <a href="http://localhost/wpac/?blocks=mainbar-right" rel="next"><img width="160" height="150" src="http://localhost/wpac/wp-content/uploads/2011/02/2974999772_7085da4d347.jpg" class="attachment-post-thumbnail wp-post-image" alt="2974999772_7085da4d347" title="2974999772_7085da4d347" /></a> </div>
        </div>

      <div class="block-3 border-top">
            <h2><a href="http://localhost/wpac/?blocks=sidebar" title="Permalink to Sidebar" rel="bookmark">Sidebar</a></h2>
            <a href="http://localhost/wpac/?blocks=sidebar" title="Permalink to Sidebar" rel="bookmark"><img width="160" height="150" src="http://localhost/wpac/wp-content/uploads/2011/02/2974999772_7085da4d3410.jpg" class="attachment-post-thumbnail wp-post-image" alt="2974999772_7085da4d3410" title="2974999772_7085da4d3410" /></a>
            <p></p>

            <p></p>
        </div>

It doesn’t matter in which single post I am. The thumbnails of Mainbar Left and Mainbar Right are always displayed)

Any suggestions?

EDIT:

Full code:

<?php
/**
 * The Template for displaying all single posts.
 *
 * @package WordPress
 * @subpackage Starkers
 * @since Starkers 3.0
 */

    get_header(); ?>

    <?php get_sidebar(); ?>

    <div id="content">
        <?php // Create and run custom loop
            $custom_posts = new WP_Query();
            $custom_posts->query('post_type=blocks&location=Work&section=Intro');
            while ($custom_posts->have_posts()) : $custom_posts->the_post();
        ?>  <div class="block-1">
                <?php the_post_thumbnail('large'); ?>
            </div>
        <?php endwhile; ?>

        <?php // Create and run custom loop
            $custom_posts = new WP_Query();
            $custom_posts->query('post_type=blocks&location=Work&section=Tagline');
            while ($custom_posts->have_posts()) : $custom_posts->the_post();
        ?>  <div class="block-2 padding-top">
                <?php the_content(); ?>
            </div>
        <?php endwhile; ?>
        <?php wp_reset_query(); ?>

        <?php // Create and run custom loop ?>
            <div class="block-2 border-top">
            <?php // Display the thumbnail of the previous post ?>
                <div class="float-left"> <?php
                    $prevPost = get_previous_post();
                    $prevthumbnail = get_the_post_thumbnail($prevPost->ID); ?>
                    <h2><?php previous_post_link('%link', 'Previous'); ?></h2>
                    <?php previous_post_link('%link', $prevthumbnail); ?>
                </div>

            <?php // Display the thumbnail of the next post ?>
                <div class="float-right"> <?php
                    $nextPost = get_next_post();
                    $nextthumbnail = get_the_post_thumbnail($nextPost->ID); ?>
                    <h2><?php next_post_link('%link', 'Next'); ?></h2>
                    <?php next_post_link('%link', $nextthumbnail); ?>
                </div>
            </div>

        <?php // Create and run custom loop
            $custom_posts = new WP_Query();
            $custom_posts->query('post_type=blocks&location=Front Page&section=Sidebar');
            while ($custom_posts->have_posts()) : $custom_posts->the_post();
        ?>  <div class="block-3 border-top">
                <h2><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
                <a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_post_thumbnail(); ?></a>
                <p><?php the_excerpt(); ?></p>
                <p><?php echo get_post_meta($post->ID, "Other_Work", true); ?></p>
            </div>
        <?php endwhile; ?>

        <?php // Start the main loop
            if ( have_posts() ) while ( have_posts() ) : the_post();
        ?>  <div class="block-4 border-top">
                <?php the_content(); ?>
            </div><!-- .entry-content -->
        <?php endwhile; // end of the loop. ?>

        <?php get_sidebar('secondary'); ?>
    </div><!-- #content -->

    <?php get_footer(); ?>

Related posts

Leave a Reply

3 comments

  1. Update: OK. If you get to keep changing the question, I get to delete what I had written before and start all over again.

    To be honest, I’m a bit confused about what you are trying to do. Since this appears to be for a single post (based on the comment at the top of your template), it is unclear to me what your first 2 custom loops are meant to accomplish. It looks like you are printing out the thumbnails and contents of all blocks posts that have a location of Work, regardless of what single post you are on. If you simply want to show the thumbnail and content for the current, single post, then just do that.

    Note: because the custom loop for the Front Page posts calls the_post(), it is modifying the global $post. I don’t know if your sidebar code is depending on that being the original post or not, but I stuck in a call to wp_reset_query() just in case.

    Below is what I think you were trying to accomplish, but I could be wrong:

    <?php
    /**
     * The Template for displaying all single posts.
     *
     * @package WordPress
     * @subpackage Starkers
     * @since Starkers 3.0
     */
    
        get_header(); ?>
    
        <?php get_sidebar(); ?>
    
        <div id="content">
    <?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
    
        <div class="block-1">
                <?php the_post_thumbnail('large'); ?>
            </div>
    
            <div class="block-2 padding-top">
                <?php the_content(); ?>
            </div>
    
            <div class="block-2 border-top">
                <?php // Display the thumbnail of the previous post ?>
                <div class="float-left"> <?php
                    $prevPost = get_previous_post();
                    $prevthumbnail = get_the_post_thumbnail($prevPost->ID); ?>
                    <h2><?php previous_post_link('%link', 'Previous'); ?></h2>
                    <?php previous_post_link('%link', $prevthumbnail); ?>
                </div>
    
            <?php // Display the thumbnail of the next post ?>
                <div class="float-right"> <?php
                    $nextPost = get_next_post();
                    $nextthumbnail = get_the_post_thumbnail($nextPost->ID); ?>
                    <h2><?php next_post_link('%link', 'Next'); ?></h2>
                    <?php next_post_link('%link', $nextthumbnail); ?>
                </div>
            </div>
    <?php endif; ?>
    
            <?php // Create and run custom loop
                $custom_posts = new WP_Query();
                $custom_posts->query('post_type=blocks&amp;location=Front Page&amp;section=Sidebar');
                while ($custom_posts->have_posts()) : $custom_posts->the_post();
            ?>  <div class="block-3 border-top">
                    <h2><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
                    <a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_post_thumbnail(); ?></a>
                    <p><?php the_excerpt(); ?></p>
                    <p><?php echo get_post_meta($post->ID, "Other_Work", true); ?></p>
                </div>
            <?php endwhile; ?>
    
            <?php wp_reset_query(); // I don't know if this is needed by the sidebar code. If not, you can delete this. ?>
            <?php get_sidebar('secondary'); ?>
        </div><!-- #content -->
    
        <?php get_footer(); ?>
    
  2. It looks like you’re setting up 2 loops when you don’t need to. If you’re in a template that’s displaying a ‘blocks’ post (e.g. single-blocks.php), then simply use the get_previous_post and get_next_post functions.

    Something like:

    <?php 
        the_post();
    ?><div class="float-left"> <?php
            $prevPost = get_previous_post();
            $prevthumbnail = get_the_post_thumbnail($prevPost->ID);
            previous_post_link('%link',''.$prevthumbnail.'');
    ?>  </div>
    
     <div class="float-right"> <?php
            $nextPost = get_next_post();
            $nextthumbnail = get_the_post_thumbnail($nextPost->ID);
            next_post_link('%link',''.$nextthumbnail.'');
    ?>  </div>
    

    Just noticed you’re outside of the loop, in which case, set up your query so it only returns one post. Adding the post ID in to the WP_Query arguments.