Hmm. Well, one of the options might be to create a custom meta entry which is the url of your thumbnail, such as "article_thumb", this could then be accessed to display it instead of the title of the post.
Something along these lines might do the trick:
<ul>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<li>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Link to <?php the_title(); ?>">
<?php
$thumb = get_post_meta($post->ID, "article_thumb", true);
if (!empty($thumb)) { ?>
<img class="category_thumb" src="<? echo $thumb;?>" width="100" alt="Thumbnail image for post titled '<?php the_title();?>'" />
<? }
else { the_title(); };
?>
</li>
<?php endwhile; ?>
</ul>
<?php else : ?>
<h2 class="post-title"><?php _e('Not Found'); ?></h2>
<p><?php _e("Sorry, but you are looking for something that isn't here. Double check your URL or you should try searching for it."); ?></p>
<?php @include (TEMPLATEPATH . "/searchform.php"); ?>
<?php endif; ?>
If it doesn't work, I've made an error in my syntax as php isn't my strong point, but what I generally do is make sure that I don't just always try to insert my custom meta info - hence I always use
if (!empty($meta))
to make sure that something is there before I try to render it out.
If I knew how I'd make a plugin to do this, but unfortunately that's way beyond me.
What it would need is an additional upload box (or an adjustment to the current one) in which you would designate an uploaded image to be the thumbnail for the post, and then along with that there'd be a new template tag which would sort out everything else... anyone want to do that?
;)
I've used that custom meta thumbnail location over here: http://www.pixelapes.com/blog
I've only just set it up, so only the most recent two posts are showing thumbnails. Of course, that's the advantage to only showing the thumbnail "if" there's one present.
Finally - not to ramble on too much - I noticed your example code listing border="0" in your image element. No! Let's break that habit. Assign a class to that image and you can customise borders and much more through your style sheet! Also, don't forget to close your image element thusly:
<img src="..." alt="..." width="..." height="..." />
Of course, if you're using HTML transitional or something, just ignore me ranting (I can't help myself)...
exbionic
moderno
