图文并茂会给文章带来好的阅读体验，郑永博客很早就养成了给每篇文章放图片的习惯，就算没有也要给文章截取一张。既然文章有图片，少不了给首页文章列表也添加一道光彩，于是利用代码给首页和其他页面的文章列表配上一张缩略图，要想完美的控制页面排版，我们还要给这个缩略图代码设置一些功能，让它能自动判断各种类型的文章。
1.当文章有多张图片时，调用第一张图片作为缩略图。
2.当文章没有图片时，自动随机抽取一张我们准备好的图片，这是为了不让列表因为多篇没图的文章而重复显示一张图片。
3.当文章插入的是外链图片时，可以支持将它显示出来。
4.当文章设置了特色图片，那么就把特色图片作为首页文章列表的缩略图。
其实很多博客和我一样，早已用上这种方法，但最近发现一个问题，不同大小的图片有时候按比例缩放会很粗糙，所以决定不按比例缩放，直接按尺寸显示部分图像，这样看起来舒服多了。
要这样显示图片其实很简单，当我们发布一篇带图的新文章，系统自动按150x150的尺寸剪切了图像的一部分作为列表缩略图，反正系统都会产生这样的图片，放在后台用就太浪费了，所以直接通过代码获取它的地址来作为首页的缩略图是再好不过了，由于mg12分享过这种缩略图方法，我们在此基础上修改和添加一些代码，让它实现上面提到的4个功能，算是增强完善版。
把以下代码加入主题的function里：
# 缩略图，支持外链，特色图，
function the_first_img() {
global $post, $posts;
$args = array(
'numberposts' => 1,
'order'=> 'ASC',
'post_mime_type' => 'image',
'post_parent' => $post->ID,
'post_status' => null,
'post_type' => 'attachment'
);
$attachments = get_children($args);
$first_img = '';
if($attachments) {
$image = array_pop($attachments);
$imageSrc = wp_get_attachment_image_src($image->ID, 'thumbnail');
$first_img = $imageSrc[0];
}
else{
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
$first_img = $matches [1] [0];if(empty($first_img)){
$rand = mt_rand(1, 10);//10张图片，如果没有这么多，3张也行。
echo get_bloginfo ( 'stylesheet_directory' );
echo '/images/rand/'.$rand.'.jpg';//这个是随机图片的文件夹地址，图片应以1至最大图片数的数字来命名。
}
}
return $first_img;
}
然后在需要的地方调用如下代码：
<?php if (has_post_thumbnail()) { the_post_thumbnail('thumbnail'); }
else { ?>
<img src="<?php echo the_first_img() ?>" width="150px" height="150px" alt="<?php the_title(); ?>"/>
<?php } ?>
怎么样？简单吧？代码要要归功于小蝴蝶的修改，有了她的帮忙，想要什么样的效果折腾起来都事半功倍！
作者：郑永博客
