免插件wordpress缩略图完善版

图文并茂会给文章带来好的阅读体验,郑永博客很早就养成了给每篇文章放图片的习惯,就算没有也要给文章截取一张。既然文章有图片,少不了给首页文章列表也添加一道光彩,于是利用代码给首页和其他页面的文章列表配上一张缩略图,要想完美的控制页面排版,我们还要给这个缩略图代码设置一些功能,让它能自动判断各种类型的文章。

1.当文章有多张图片时,调用第一张图片作为缩略图。

2.当文章没有图片时,自动随机抽取一张我们准备好的图片,这是为了不让列表因为多篇没图的文章而重复显示一张图片。

3.当文章插入的是外链图片时,可以支持将它显示出来。

4.当文章设置了特色图片,那么就把特色图片作为首页文章列表的缩略图。

其实很多博客和我一样,早已用上这种方法,但最近发现一个问题,不同大小的图片有时候按比例缩放会很粗糙,所以决定不按比例缩放,直接按尺寸显示部分图像,这样看起来舒服多了。

要这样显示图片其实很简单,当我们发布一篇带图的新文章,系统自动按150x150的尺寸剪切了图像的一部分作为列表缩略图,反正系统都会产生这样的图片,放在后台用就太浪费了,所以直接通过代码获取它的地址来作为首页的缩略图是再好不过了,由于mg12分享过这种缩略图方法,我们在此基础上修改和添加一些代码,让它实现上面提到的4个功能,算是增强完善版。

gt_1_600_300

把以下代码加入主题的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 } ?>

怎么样?简单吧?代码要要归功于小蝴蝶的修改,有了她的帮忙,想要什么样的效果折腾起来都事半功倍!

分类:网络博客 标签:,,,

上一篇:Post Ratings插件无法工作的解决方法

下一篇:wordpress读者墙排除无gravatar头像

已经有27条评论!

Loading...
  1. 不喜欢自动裁剪。。。

    沙发!
  2. 板凳好凉啊 呜

    板凳!
  3. 只要不把裁剪的小图另存下来就是好的,否则太浪费空间了。

    地板!
  4. [耍酷]

    4F
  5. 嗯 我之前也这么修改过 不过没有把代码分享出来

    我好自私

    5F
  6. 哈哈,我的博客主题自带。

    6F
  7. 不错,这是你一贯的风格

    7F
  8. 其实图片还是上传到自己空间比较好,比较安全

    9F
  9. [冷笑] [冷笑] 你和小蝴蝶原来是好基友。。。。

    10F
  10. XX 一不留神 看了侧边 一排评论…

    我只看不说话了!

    11F
  11. 勇哥现在的实现方式不是这样了吧?

    12F

怎么样?你也说一句吧!

gravatar

冷笑 忧伤 恶魔 笑脸 红脸 咧嘴笑 吃惊 惊讶 困惑 耍酷
大笑 抓狂 痛苦 转眼珠 眨眼 好主意 囧 无表情 哭泣 坏笑