首页 » 技术文章 » wordpress教程 » 浏览内容

WordPress代码开启七牛CDN及集成七牛缩略图方法

2015-01-03 20:50 1877 1 发表评论

之前在介绍纯静态缓存代码的时候，曾搬出了七牛CDN的代码版，我瞅着应该是从鱼叔的WordPress七牛云存储插件中扒出来的一大段代码，给人很严谨，很专业的赶脚。

一、七牛CDN代码

其实，我只用了寥寥数行代码就搞定了：

/**

* WordPress七牛CDN代码版 By 小残博客

**/

function QiNiuCDN(){

function Rewrite_URI($html){

/* 前面是需要用到七牛的域名,后面是需要加速的静态文件类型，使用分隔符 | 隔开即可 */

$pattern ='/http:\/\/(m\.|www|)zhangge\.net\/wp-([^"\']*?)\.(jpg|js|css|gif|png|jpeg)/i';

/* 七牛CDN空间地址,请自行替换成实际空间地址 */

$replacement = 'http://cdn.exehack.net/wp-$2.$3';

$html = preg_replace($pattern, $replacement,$html);

return $html;

}

if(!is_admin()){

ob_start("Rewrite_URI");

}

add_action('init', 'QiNiuCDN');

使用说明：将上面的代码修改后添加到WordPress主题下的functions.php中即可(将cdn.exehack.net修改为自己的域名)
Ps：实际上，如果是结合之前分享PHP缓存代码，仅需以上代码中的第8、10、11行即可实现，合并亦可：

1	$html = preg_replace('/http:\/\/(m\.\|)zhangge\.net\/wp-([^"\']*?)\.(jpg\|js\|css\|gif\|png\|jpeg)/i','http://cdn.exehack.net/wp-$2.$3',$html);

没用过七牛？那点击注册一个好了！

二、谈图片尺寸
最近遇到一件很惭愧的事情，个人保守估计，很多WordPress站长都没意识到，甚至都没设置过。
先看一个设置界面：

没错，就是WordPress后台的多媒体设置，可以设置一些图片尺寸。

实际上，WordPress安装后就默认了多个尺寸，只要你上传图片，他就会将图片自动裁剪出多种尺寸！浪费空间暂且不说，某些擦边球网站图片特多，一个月成千上万图片，你还裁剪一下…可想而知

WordPress网站的效率呈直线下降（目录下的文件数太多会影响PHP性能，感兴趣的可以自行查资料）！
说一下，我以前的做法：
图片暗箱放大功能得到充分利用，很多博客集成了暗箱，但是他并没有明白暗箱的真谛！
可能喜欢暗箱效果，是因为他很炫，很新奇。实际上，我认为暗箱放大有一个很实用的功能就是加快网页的加载速度！为什么这么说呢？
比如我这样来设置：我写文章的时候，插入的是最宽为300px的中等图片，插入图片后，WordPress会默认给图片一个原始图片的超链接：

那么读者打开文章页面时，浏览器只会加载这个300px的img中图，而用户如果想看清楚图片时，就会点击图片放大，这时候才会加载最清晰的完整图片！要知道，并不是每个读者都会想去看图片的！所以，暗箱放大功能可以变相的加快页面加载速度！因为你在文章中插入的是小体积的中等图，只有点击放大才会加载大图。
有意思的是，很多博客用了暗箱放大，但是文章的img引用的是完整图片，而a标签链接的也是完整图片，那点击放大还有意义么？？？难道真的只是为了酷炫？那只能说你还没摸透暗箱的实际价值！
当然，这img加载图片的大小得看主题，是300px还是其他，就随个人喜好了！
好了，啰嗦一大堆，下面继续正题！

三、七牛缩略图

前几日，帮用户优化WordPress的时候，偶然试用了一次七牛的缩略图！用完之后，不禁感叹：既然都用七牛CDN了，何必让图片弄得四分五裂，七零八落？真的有必要裁剪图片存放么？我以前也真是愚昧了。
就算在多媒体里面只保留了一个300px大小的中图，但是知更鸟主题的特色图片依然是裁剪成3份，也就是说我上传一张图片，会裁剪为五份！！这也太坑爹了吧？
实际上，七牛的提供了缩略图API的，而且功能实用又强大，完全可以替代WordPress自带的苦逼裁剪功能！在我换成了七牛缩略图之后，对空间多余尺寸图片进行了清理，这些多余尺寸图片，居然占据了空间近三分之一的大小！
①、进入七牛，在数据处理中新建裁剪样式：