非插件方式实现WordPress延迟加载功能,用到lazysizes这个js,优点是小,并且不需要jQuery。
首先引入lazysizes:
wp_enqueue_script( 'lazysizes-script','https://cdn.jsdelivr.net/combine/npm/lazysizes@5.2.0', array(), null, true );
图片参加class:
/** * lazyload * https://github.com/aFarkas/lazysizes */ add_filter ('the_content', 'lazyload'); function lazyload($content) { if(!is_feed()||!is_robots) { $content=preg_replace('/<img(.+)src=[\'"]([^\'"]+)[\'"](.*)>/i',"<img\$1data-src=\"\$2\" src=\"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\"\$3>\n<noscript>\$0</noscript>",$content); $content=preg_replace('/<img class=[\'"]([^\'"]+)[\'"]/i',"<img class=\"$1 lazyload\"",$content); } return $content; }
原文分享自https://wpmore.cn/%e9%9d%9e%e6%8f%92%e4%bb%b6lazysizes%e7%bb%99wordpress%e5%81%9a%e5%9b%be%e7%89%87%e5%bb%b6%e8%bf%9f%e5%8a%a0%e8%bd%bdlazyload%e5%8a%9f%e8%83%bd.html
声明:本文采用 BY-NC-SA 协议进行授权,如无注明均为原创,转载请注明转自 你好!刘
本文地址:非插件(lazysizes)给WordPress做图片延迟加载(lazyload)功能
本文地址:非插件(lazysizes)给WordPress做图片延迟加载(lazyload)功能
发表评论