禁止WordPress生产srcset/sizes响应式图片属性问题

我们公司大部分技术给客户做的企业网站都会采用WordPress内核,因为企业网站用户产品比较多,所以会将图片等文件利用第三方存储,比如七牛和又拍云,还有腾讯云也有免费额度的云存储。今天有被告知有一个客户反馈其网站编辑发布产品之后前台看不到产品图片。

遇到救急的事情他们肯定会想到国外主机优惠来解决这个问题,登录这个客户企业网站后台看到最新添加的某个产品,点击编辑按钮确实看到编辑完好的产品内容介绍和内容中加入的产品图片。保存之后就在页面中看不到图片,然后我还右键获取图片地址看到路径怎么是本地路径的?理应该是远程第三方的图片存储路径。

查看源代码,看到这样的情况:

<p><img class=\”alignnone wp-image-1096 size-full\” src=\”https://oss.******.com/wp-content/uploads/2018/03/sbguanli.jpg\” alt=\”设备管理\” width=\”620\” height=\”49\” srcset=\”https://www.******.com/wp-content/uploads/2018/03/sbguanli.jpg 620w, https://www.******.com/wp-content/uploads/2018/03/sbguanli-600×47.jpg 600w\” sizes=\”(max-width: 620px) 100vw, 620px\” /></p>

也就是说图片在超过多大的时候会自动生成本地地址srcsetsizes属性。这里我们需要禁止掉才可以。

//禁止响应式图片(itbulu.com)
function disable_srcset( $sources ) {
return false;
}
add_filter( \’wp_calculate_image_srcset\’, \’disable_srcset\’ );

添加到当前主题Functions.php文件中,刷新缓存,即可解决问题。