How to show first image of the wordpress post as a thumbnail

In wordpress, if you want to show first image of the post as a post thumbnail in loop, then you can do it easily. You just need to download a code snippet called timthumb.php. This great code is enough to get the thumbnail of your choice from the post. It is highly optimized for the wordpress.

Just follow the steps below to do it:

Make a directory (with wordpress write permission) named "thumbs" in your theme root directory.
Put the timthumb.php file inside it. Directory should be writable because this file will create catch images folder inside it.
Inside your theme's functions.php file (Make one if not exists) add the code below:

 /* Extract thumbnails from post */
function show_thumb($w,$h,$zc,$cropfrom,$q) {
     global $post;
     preg_match_all('/\< *[img][^\>]*src *= *[\"\']{0,1}([^\"\'\ >]*)/',get_the_content(),$matches);
     $thumb = get_post_meta($post->ID, 'thumb', true);
     if ($thumb) {
          print get_bloginfo('template_directory').'/thumbs/timthumb.php?src='.$thumb.'&amp;w='
               .$w.'&amp;h='.$h.'&amp;zc='.$zc.'&amp;cropfrom='.$cropfrom.'&amp;q='.$q;
     } elseif (count($matches[1]) > 0) {
          print get_bloginfo('template_directory').'/thumbs/timthumb.php?src='. $matches[1][0] .'&amp;w='
               .$w.'&amp;h='.$h.'&amp;zc='.$zc.'&amp;cropfrom='.$cropfrom.'&amp;q='.$q;
     } else {
          print get_bloginfo('template_directory').'/thumbs/timthumb.php?src='. get_bloginfo('template_directory').'/images/no_image.png&amp;w='
               .$w.'&amp;h='.$h.'&amp;zc='.$zc.'&amp;cropfrom='.$cropfrom.'&amp;q='.$q;
     }
}

Now your code is ready to include in wordpress theme. You can use this code in index.php, archive.php etc file as below:

 <?php if (have_posts()) : ?>
<div class="heading"><span>Recent Posts</span></div>
<!-- <entries -->
<ul id="entries">
     <?php     while (have_posts()) : the_post(); ?>
     <li>
               <div class="post-thumb">
                         <img title="<?php the_title(); ?>" alt="<?php the_title(); ?>" src="<?php show_thumb(160,125,1, middle, 90); ?>">
               </div>
               <div class="entry">
                         <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                                   <small><?php the_time('F jS, Y') ?>
                                             <span>|</span> <?php the_category(', ') ?> <span>|</span>
                                             <?php the_author_posts_link() ?> <span>|</span>
                                             <img src="<?php bloginfo('template_directory'); ?>/images/like_mark.png" /><?php comments_popup_link('0', '1', '%'); ?>
                                   </small>
                         <div class="snippet">
                                   <?php the_excerpt(); ?>
                         </div>
               </div>                    
               <div class="clearing"></div>
     </li>               
     <?php endwhile; ?>
</ul>
<!-- </entries -->
<?php else : ?>
<?php include (TEMPLATEPATH . '/404.php'); ?>
<?php endif; ?>

Sample css for the thumbnail:

/*-- thumnails --*/
.post-thumb{float:left;margin-bottom: 15px;}
.post-thumb img{display: block;font-size:10px;height:125px;overflow:hidden;text-align: center;width: 160px;}

Cheers !!!