解决 wordpress 七牛云存储插件无法 CDN 加速 hestia 主题的首页 banner 图片

更新日期: 2018-06-13 阅读次数: 2612 分类: wordpress

现象

使用了 wordpress 七牛云存储插件之后,首页的 banner 及博文的 banner 图片都加载缓慢。而产品图片,以及博文中的图片则加载迅速。从 chrome 的 network 查看,的确部分使用了 CDN,而部分没有。

最简单的方法是查看源代码

vim wp-content/plugins/wpjam-basic/wpjam-cdn.php

可以看到,七牛云存储插件的实现原理就是在生成页面代码时,将图片资源的源站地址替换为了 CDN 地址。代码实现就是找 img 标签,然后替换。

但是,问题就来了,hestia 主题,大量采用了 inline css 的 background-image, 所以,会看到各种 banner 没有被 CDN 加速。

例如:

<div class="header-filter" style="background-image: url(http://www.sunzhongwei.com/wp-content/uploads/2018/06/wanhua.jpg)"></div>

解决方法

不太敢改插件的代码,因为说不定哪天插件会升级,所以我决定改主题的代码了。毕竟主题代码已经做了不少改动。

首页 banner

vim ./wp-content/themes/hestia/inc/sections/hestia-big-title-section.php

$hestia_big_title_background = str_replace("www.sunzhongwei.com", "cdn.sunzhongwei.com", $hestia_big_title_background);

博文 banner

vim ./wp-content/themes/hestia/inc/template-tags.php

$background_image = str_replace("www.sunzhongwei.com", "cdn.sunzhongwei.com", $background_image);

爱评论不评论

近期节日

2019年09月20日 国际爱牙日
2019年09月21日 国际和平日
2019年09月22日 世界无车日
2019年09月23日 秋分
2019年09月23日 国际聋人节
2019年09月27日 世界旅游日
2019年10月01日 国庆节
2019年10月04日 世界动物日
2019年10月07日 重阳节
2019年10月08日 寒露
2019年10月09日 世界邮政日
2019年10月10日 辛亥革命纪念日
查看更多节日