本教程仅适用于zblogphp版本,适用于本blog,其他请参照折腾。
首先,七牛云存储插件是必备的,然后原先调用文章第一张图片的功能也是存在的,
由于之前都是直接调用图片url再加以缩放,实质还是原图输出,
如下图:
这么一小张缩略图就要700多k,有点恐怖,下面是整个首页图片大小:
达到了2MB,未免太大了点,于是灵感来自@唐朝,发在群里的一个链接。
就是在七牛云存储里,在图片url后面加上句参数就能实现自动裁剪,于是我们只要调用图片的url后再在后面加上自己所要的参数就搞定了。
到了放代码时间了:
{php} $temp=rand(1,17); $pattern="/<[img|IMG].*?src=[\'|\"](.*?(?:[\.gif|\.jpg|\.png]))[\'|\"].*?[\/]?>/"; $content = $article->Content; preg_match_all($pattern,$content,$matchContent); if($matchContent[1][0]) $temp=$matchContent[1][0]; else $temp="zb_users/theme/$theme/images/random/$temp.jpg"; {/php} <img src="{$temp}" width="140" height="100" alt="{$article.Title}" />
其中代码什么意思怎么实现的,我不懂,我只知道最后一句
<img src="{$temp}"
里面{$temp}就是要调用的图片的url,所以在这后面加上七牛裁剪的参数
?imageView/1/w/140/h/100
,如下:其中参数详解请阅读七牛官方图像接口处理<img src="{$temp}?imageView/1/w/140/h/100" width="140" height="100" alt="{$article.Title}" />
这样就好了,很简单很简单吧,最后效果如下图:
还是很明显的