How To Disable Responsive Images Srcset In Wordpress

禁用WordPress默认生成响应式图片的功能

前面给网站接入了又拍云加速,使用又拍云给WordPress网站加速,结果今天就碰到了一个bug。

我给禁用WordPress新版编辑器的文章加了张图,然后图片不显示,我看编辑界面图片地址是替换成了又拍云的,但是前台图片不显示。查看源码发现还有博客的资源链接。

图片不显示

<p><img src="https://blog.naibabiji.com/wp-content/uploads/2019/04/naibabiji.com_2019-05-06_14-49-40.jpg" alt="禁用Wordpress新版编辑器" width="600" height="377" class="aligncenter size-full wp-image-744" srcset="https://blog.naibabiji.com/wp-content/uploads/2019/04/naibabiji.com_2019-05-06_14-49-40.jpg 600w, https://blog.naibabiji.com/wp-content/uploads/2019/04/naibabiji.com_2019-05-06_14-49-40-150x94.jpg 150w" sizes="(max-width: 600px) 100vw, 600px" /></p>

可以看到在源代码里面莫名其妙的多了srcset=””和sizes=””两个属性,网址是博客的老地址。

搜了一下,原来是因为Wordpress在4.4版本后就加入了自动设置响应式图片的功能,又拍云插件貌似还不能替换这个地方。所以我们需要禁用这个自动响应式图片属性代码。

禁用WordPress默认生成响应式图片的功能

在函数文件里面添加下面内容保存即可。

//disable srcset on images
function disable_srcset( $sources ) {
return false;
}
add_filter( 'wp_calculate_image_srcset', 'disable_srcset' );

另外奶爸还测试下,只要图片里面不包含这个class属性,也不会生成响应式图片的属性。

class=”aligncenter size-full wp-image-744″

另外,也有对应的WordPress插件Disable Responsive Images Complete

给本文打分 post
滚动至顶部