Loop to fetch 3 post_thumbnail instances from 3 most recent custom post types named “portfolio”

3 comments

1. Try this:

   <?php get_header(); ?>
   <div id="content" class="clearfix row">     
   <article id="post-<?php the_ID(); ?>" <?php post_class('clearfix'); ?> role="article">
       <section id="work" class="row">      
           <div class="span3">
               <h3>Recent Work</h3>
               <p>Intro Lorem ipsum</p>
           </div>          
           <?php $args = array(
               'post_type'      => 'portfolio',
               'post_status'    => 'publish',
               'posts_per_page' => 3
           );
           $query = new WP_Query( $args );
           $porfolio_post_ids = array();
           if ( $query->have_posts() ) {
               while ( $query->have_posts() ) {
                   global $post;
                   $query->the_post();
                   array_push( $porfolio_post_ids, $post->ID );
               }
           } ?>
           <div class="span6">
               <a href="<?php echo get_permalink( $porfolio_post_ids[0] ); ?>">
                   <?php echo get_the_post_thumbnail(  
                       $porfolio_post_ids[0] , 'medium' 
                   ); ?> <!--Should be from custom post 'A' -->
               </a>
           </div>   
           <div class="span3">
               <a href="<?php echo get_permalink( $porfolio_post_ids[1] ); ?>" >
                   <?php echo get_the_post_thumbnail(  
                       $porfolio_post_ids[1] , 'thumbnail' 
                   ); ?><!--Should be from custom post 'B' -->      
               </a>    
               <a href="<?php echo get_permalink( $porfolio_post_ids[2] ); ?>">
                   <?php echo get_the_post_thumbnail( 
                       $porfolio_post_ids[2] , 'thumbnail' 
                   ); ?><!--Should be from custom post 'C' -->
               </a>  
           </div>
   

   and don’t forget to set the thumbnail in functions.php as mentioned in David’s answer.

   One more thing I noticed in your code: you said that your post type is “portfolio” and in the permalink you used single-project.php, but shouldn’t it be single-portfolio.php?

   Log in to Reply

2. mattc,

   You’re problem is that you have all of the elements inside the loop. You need to set a counter and then only apply the items you need when they are needed. I’ve only included the pertinent code below:

   <?php 
    // set a variable to start a count
    $i = 0;
   
    $first_query = new WP_Query('post_type=portfolio');   
    // the loop starts
    while($first_query->have_posts()) : $first_query->the_post(); 
   
    // add 1 to our variable on each pass of the loop
    $i++;
   
    // do the big image first
    if ($i == 1) {
    ?>
      <div class="span6">
           <a href="single-project.php">
           <?php the_post_thumbnail('medium'); ?> <!--Should be from custom post 'A' -->
           </a>
       </div>
    <?php } else { // the rest of the images ?>
    <?php if ($i == 2) {  // need to open our wrapping div here ?>
       <div class="span3">
    <?php } ?>
           <a href="single-project.php" >
            <?php the_post_thumbnail('thumbnail'); ?><!--Should be from custom post 'B' and 'C' -->
           </a>
     <?php if ($i == 3) { // close out the wrapping div?>
       </div>
     <?php } ?>
     <?php endwhile; ?>
   

   Log in to Reply

3. I use this implementation nicely — You can see how it’s grabbing it:

   $thumbnails = get_posts(array('numberposts'=>1,'orderby'=>'ASC','meta_key' => '_thumbnail_id'));

   You can then turn to ‘numberposts’=>3 and build your thumbnail structure:

       <?php if ( has_post_thumbnail() ) {
         global $post;
         $thumbnails = get_posts(array('numberposts'=>3,'orderby'=>'ASC','meta_key' => '_thumbnail_id'));
         foreach ($thumbnails as $thumbnail) {
         echo '<a href="' . get_permalink( $post->ID ) . '" title="' . esc_attr( $post->post_title ) . '">';
         echo get_the_post_thumbnail($thumbnail->ID, 'small-thumb', array( 'alt' => esc_attr( $post->post_title ), 'title' => esc_attr( $post->post_title ) ));
         echo '</a>';
         }        
        ?>   
   

   Edited: Don’t forget to set your thumbnail size:

   echo get_the_post_thumbnail($thumbnail->ID, 'small-thumb', array( 'alt' => esc_attr( $post->post_title ), 'title' => esc_attr( $post->post_title ) ));

   Change the ‘small-thumb’ to whatever you’ve set, if you need to set some sizes you can put this in your functions.php:

    //Add support, if you need it.
    if ( function_exists( 'add_theme_support' ) ) {
      add_theme_support( 'post-thumbnails' );
       set_post_thumbnail_size( 960, 276, true ); // default Post Thumbnail dimensions   
     }
   
    //Set them sizes, yo
    if ( function_exists( 'add_image_size' ) ) { 
      add_image_size( 'large-thumb', 960, 276, true ); //(cropped)
      add_image_size( 'medium-thumb', 605, 174 ); // 605px wide, 174 high, not cropped
      add_image_size( 'small-thumb', 288, 83, true ); //(cropped) 
      add_image_size( 'small-square', 100, 100, true ); //(cropped) 
    }
   

   Cheers,

   Log in to Reply