Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Wordpress loop not showing post thumbnails...

Featured Replies

Hi All,

 

I'm trying to show my post thumbnails in a grid using this codehttp://pastebin.com/Hny5kS6b.

It's working and looping through what it should but it's not showing the post thumbnails beyond the first one.

Here's a screenshot.

 

Unfortunately, it's being developed locally so can't share the site.

I'm at a bit of a loss as to why it's not displaying the thumbnails. The images are there and the thumbnails are being generated automatically for them - you can see it clearly worked on the first one.

 

Hopefully my code will be something to go on though.

 

Many thanks for any help in advance!

-Jack

  • Author

Hi jack..

Can you give your code?

 

Hi, I did!

See the pastebin link in my post.

You try to cover your thumbnails with title..

<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail('our-work-item'); ?>
                               <h2><?php the_title(); ?></h2></a>

 

Might be you can try like this:

<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail('our-work-item'); ?></a>
    <h2><?php the_title(); ?></h2>

 

 

 

 

Code:

 

<?php $counter = 1; //start counter

       $grids = 3; //Grids per row

       query_posts('post_type=our-work&order=ASC&posts_per_page=11');

       if(have_posts()) : while(have_posts()) : the_post();
       ?>

       <?php if($counter == 1) : ?>

               <section class="row clearfix">
                       <div class="fourcol box clearfix">
                               <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail('our-work-item'); ?></a>
    <h2><?php the_title(); ?></h2>
                               <p class="excerpt"><?php the_excerpt(); ?><p>
                               <div class="item-tags"><?php echo $cfs->get('tags'); ?></div>
                       </div>

                       <?php elseif($counter == 2) : ?>

                       <div class="fourcol box clearfix">
                               <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail('our-work-item'); ?></a>
    <h2><?php the_title(); ?></h2>
                               <p class="excerpt"><?php the_excerpt(); ?><p>
                               <div class="item-tags"><?php echo $cfs->get('tags'); ?></div>
                       </div>

                       <?php elseif($counter == $grids) : ?>

                       <div class="fourcol box last clearfix">
                               <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail('our-work-item'); ?></a>
    <h2><?php the_title(); ?></h2>
                               <p class="excerpt"><?php the_excerpt(); ?><p>
                               <div class="item-tags"><?php echo $cfs->get('tags'); ?></div>
                       </div>

               </section>

       <?php $counter = 0;     endif; ?>
       <?php $counter++; endwhile; 
endif;
?>

 

 

CMIIW

 

Cheers..

Edited by chromatic

Hey Jack. My first indication was the same as chromatic's when I saw you leaving the open anchor tag to create the link for both the thumbnail and the H2 header. Theoretically, I would think this would still work, however, I think your challenge might be with your loop code. I created a special blog page for a client recently that called in the featured image as the post thumbnail to display vertically on the page (think thumbnail to the left, Post headline to the right and post snippet below the headline). I wasn't trying to use variables to indicate the number of grids to install, however, so this may be of little use to you. Hope you can get something from it to spark you towards the answer you neee, however.

 

Pastebin: http://pastebin.com/pPWykZDD

  • Author

You try to cover your thumbnails with title..

<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail('our-work-item'); ?>
                               <h2><?php the_title(); ?></h2></a>

 

Well technically, I was just covering my thumbnails with the link.

Regardless, I changed it to the method you recommended and it didn't do anything (except remove the titles from the link).

 

What's odd to me (and I think the key to this somehow), is that it is generating and showing the first thumbnail just fine.

Is it possible there is something wrong with my query_posts?

  • Author

Hey Jack. My first indication was the same as chromatic's when I saw you leaving the open anchor tag to create the link for both the thumbnail and the H2 header. Theoretically, I would think this would still work, however, I think your challenge might be with your loop code. I created a special blog page for a client recently that called in the featured image as the post thumbnail to display vertically on the page (think thumbnail to the left, Post headline to the right and post snippet below the headline). I wasn't trying to use variables to indicate the number of grids to install, however, so this may be of little use to you. Hope you can get something from it to spark you towards the answer you neee, however.

 

Pastebin: http://pastebin.com/pPWykZDD

 

Thanks James.

Just tried your method but it's the same problem.

 

Could it be that my post thumbnails aren't being generated automatically some how and so as they don't exist, aren't being displayed?

How can I check this?

  • Author

Man, do I feel stupid!

 

I was just forgetting to set the featured images on the posts! I had done for the first one but not the rest!

I'm using custom post types to display a lot of information and as I had already uploaded an image for the main post content, I was confusing myself.

 

Once I added in the featured images, it all worked perfectly.

 

Soooo, soo stupid!

 

Thanks for all your help and suggestions!

Man, do I feel stupid!

 

Don't feel that way at all, brother! We have all been there, and likely will be there again tomorrow (or the day after!)

 

Funnily enough, I had been thinking about your challenge and when I got to the forums tonight I thought I'd ask how you were telling the individual posts what the thumbnail image should be (you figured it out!)

 

Good for you, Jack.

 

Rock on!

 

Cheers!

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.