?
Solved

WordPress: thumbnail on archive page

Posted on 2012-08-19
9
Medium Priority
?
2,275 Views
Last Modified: 2012-08-19
Wordpress 3.4.1. I have a number of posts that each has an image (uploaded to the media library), and I've done very little to the PHP code.

In looking at the archive pages, I would like to add a thumbnail of the image to the list of items shown on the archive page.

Does anyone know how to do this?

Thanks!
0
Comment
Question by:Eric AKA Netminder
  • 4
  • 3
  • 2
9 Comments
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 38310078
Add the image as the Featured Image of each post. Your theme might support that automatically and display it.  If not, it's trivial to add the support.
0
 
LVL 17

Expert Comment

by:selvol
ID: 38310086
Can I please see some of the html, php, URL or other.
The more you show the better we can ASSIST.
We can do just about anything here on EE.
But we need more information from you......

Selvol
0
 
LVL 15

Author Comment

by:Eric AKA Netminder
ID: 38310118
jason1178,

Apparently, this particular theme I'm mucking with doesn't have the functionality, which explains why I've been tearing my hair out trying to find it, because I know I saw it on another theme that turned out to be more trouble to modify than I want to spend on this.

The archive.php page is as follows:
<?php get_header(); ?>
<?php get_sidebar(); ?>
<div id="wrapper">
  <div id="content">

    <?php if (have_posts()) : ?>

    <?php $post = $posts[0]; // Hack. Set $post so that the_date() works. ?>
    <?php /* If this is a category archive */ if (is_category()) { ?>        
    <h2 class="pagetitle">Archive for the '<?php echo single_cat_title(); ?>' Category</h2>
    
    <?php /* If this is a daily archive */ } elseif (is_day()) { ?>
    <h2 class="pagetitle">Archive for <?php the_time('F jS, Y'); ?></h2>
    
    <?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
    <h2 class="pagetitle">Archive for <?php the_time('F, Y'); ?></h2>

    <?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
    <h2 class="pagetitle">Archive for <?php the_time('Y'); ?></h2>
    
    <?php /* If this is a search */ } elseif (is_search()) { ?>
    <h2 class="pagetitle">Search Results</h2>
    
    <?php /* If this is an author archive */ } elseif (is_author()) { ?>
    <h2 class="pagetitle">Author Archive</h2>

    <?php /* If this is a paged archive */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
    <h2 class="pagetitle">Blog Archives</h2>

    <?php } ?>


    <div class="navigation">
      <div class="alignleft"><?php next_posts_link('&laquo; Previous Entries') ?></div>
      <div class="alignright"><?php previous_posts_link('Next Entries &raquo;') ?></div>
    </div>

    <?php while (have_posts()) : the_post(); ?>
    <div class="post">
        <h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3>
        <small><?php the_time('l, F jS, Y') ?></small>
        
        <div class="entry">
          <?php the_excerpt() ?>
        </div>
    
        <p class="postmetadata">Posted in <?php the_category(', ') ?> 
          <strong>|</strong>  <?php edit_post_link('Edit','','<strong>|</strong>'); ?>  <?php comments_popup_link('No Comments &#187;', '1 Comment &#187;', '% Comments &#187;'); ?></p> 
        <img wp-image-16" title="mainOrnament_28" src="http://mysite.com/wp-content/uploads/2012/08/mainOrnament_28-300x22.png" alt="" width="578" height="44" style="margin:0 0 -19px -19px; " />
      </div>
  
    <?php endwhile; ?>

    <div class="navigation">
      <div class="alignleft"><?php next_posts_link('&laquo; Previous Entries') ?></div>
      <div class="alignright"><?php previous_posts_link('Next Entries &raquo;') ?></div>
    </div>
  
  <?php else : ?>

    <h2 class="center">Not Found</h2>
    <?php include (TEMPLATEPATH . '/searchform.php'); ?>

  <?php endif; ?>
    
  </div>


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

Open in new window

0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 17

Expert Comment

by:selvol
ID: 38310141
I am short on time, apolgies.
I don't know your situation and how many files you have to link to thumbs.
If not too many you can name the images the same as the  "id="post-<?php the_ID();"
On this same line before the href.
Then WP should pick image for that page.
I will be back later..

I hope I am not way off with this answer.....

 <?php while (have_posts()) : the_post(); ?>
    <div class="post">
        <h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3>
        <small><?php the_time('l, F jS, Y') ?></small>
        

Open in new window

TRY this
 <?php while (have_posts()) : the_post(); ?>
    <div class="post">
        <h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3><img src="http://yoursite.com/YOURIMAGEFOLDER/<?php the_ID(); ?>.jpg">
        <small><?php the_time('l, F jS, Y') ?></small>
        

Open in new window


Selvol
0
 
LVL 70

Accepted Solution

by:
Jason C. Levine earned 2000 total points
ID: 38310197
Apparently, this particular theme I'm mucking with doesn't have the functionality,

No big deal.  Add this to functions.php:

add_theme_support( 'post-thumbnails' );

That should enable the Featured Image box.  You may need to go to Screen Option on the post edit screen to show it.

After you can attach featured images, the following code will display them inside of any loop:

if ( has_post_thumbnail() ) {
      the_post_thumbnail();
}

The the_post_thumbnail() function takes arguments:

http://codex.wordpress.org/Function_Reference/the_post_thumbnail
0
 
LVL 15

Author Comment

by:Eric AKA Netminder
ID: 38310226
Okay, pardon me for not being all that adept at PHP... but where, in the code I posted above, would I put that? And does it have to be on three lines, or can it be written
if ( has_post_thumbnail() ) {the_post_thumbnail();} 

Open in new window

0
 
LVL 70

Assisted Solution

by:Jason C. Levine
Jason C. Levine earned 2000 total points
ID: 38310233
Probably want to try something like this:

<div class="post">
        <h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3>
        <small><?php the_time('l, F jS, Y') ?></small>

       <?php if ( has_post_thumbnail() ) {the_post_thumbnail();} ?>
                                            
        <div class="entry">
          <?php the_excerpt() ?>
        </div>

Open in new window

0
 
LVL 15

Author Comment

by:Eric AKA Netminder
ID: 38310234
I should mention... the "featured image" addition to functions.php worked like a charm.
0
 
LVL 15

Author Closing Comment

by:Eric AKA Netminder
ID: 38310254
Brilliant...

Thank you, Jason.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Build an array called $myWeek which will hold the array elements Today, Yesterday and then builds up the rest of the week by the name of the day going back 1 week.   (CODE) (CODE) Then you just need to pass your date to the function. If i…
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
Suggested Courses
Course of the Month15 days, 18 hours left to enroll

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question