WordPress首页文章摘要旁边显示缩略图的方法

首先贴出所需的css代码，放到你的主题文件style.css里面，要显示的图片的大小可以通过下面的width和height设置：

1. .thumbnail_box {
2.     float: left;
3.     width: 140px;
4.     height:100px;
5.     margin: 17px 10px 8px 15px;_margin: 17px 10px 8px 7px;
6.     padding: 4px;
7.     border:1px solid #ccc;}
8. .thumbnail img{
9.     position:absolute;
10.     z-index:3;}
11. 显示缩略图有两种方式:
    第一种：随机显示一张图片，这个需要在images文件夹下新建一个文件夹random，里面的图片最好事先处理好大小，名称统一为:tb+数字，如tb1.jpg，tb2.jpg…不要问偶为什么，程序就这么写的，实在懒得改，怕改错！
    代码如下，添加到主题文件index.php里面：
    1. <div class="thumbnail_box">
    2.     <div class="thumbnail">
    3.         <?php if ( get_post_meta($post->ID, 'thumbnail', true) ) : ?>
    4.             <?php $image = get_post_meta($post->ID, 'thumbnail', true); ?>
    5.             <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><img src="<?php echo $image; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" /></a>
    6.             <?php else: ?>
    7.             <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/random/tb<?php echo rand(1,20)?>.jpg" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" /></a>
    8.             <?php endif; ?>
    9.     </div></div>

    第二种：先从文章中读取图片作为缩略图，如果文章中没有缩略图，再使用上一种方法里面建立的random文件夹里面的图片！
    分两步：首先往主题文件functions.php添加如下代码：

    1. if ( function_exists('add_theme_support') )
    2.  add_theme_support('post-thumbnails');
    3.  function catch_first_image() {
    4.   global $post, $posts;
    5.   $first_img = '';
    6.   ob_start();
    7.   ob_end_clean();
    8.   $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
    9.   $first_img = $matches [1] [0];
    10.   if(emptyempty($first_img)){
    11.         $random = mt_rand(1, 20);
    12.         echo get_bloginfo ( 'stylesheet_directory' );
    13.         echo '/images/random/tb'.$random.'.jpg';
    14.   }
    15.   return $first_img;
    16.  }

    然后在往主题文件index.php里面添加如下代码：

    1. <div class="thumbnail_box">
    2.     <div class="thumbnail">
    3.         <?php if ( get_post_meta($post->ID, 'thumbnail', true) ) : ?>
    4.             <?php $image = get_post_meta($post->ID, 'thumbnail', true); ?>
    5.             <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><img src="<?php echo $image; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" /></a>
    6.             <?php else: ?>
    7.             <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">
    8. <?php if (has_post_thumbnail()) { the_post_thumbnail('thumbnail'); }
    9. else { ?>
    10. <img class="home-thumb" src="<?php echo catch_first_image() ?>" width="140px" height="100px" alt="<?php the_title(); ?>"/>
    11. <?php } ?>
    12. </a>
    13.             <?php endif; ?>
    14.     </div></div>

这就ok了！（原文地址：http://www.yunda51.com/?p=254）