wordpress給圖片延遲加載的好處當然是增加用戶體驗及網站加載速度了，圖片延遲加載更是給裝逼犯一種很動態的樣子效果，下面直接爆教程了哈！
圖片延遲加載的原理就是給圖片地址添加一個data-original屬性，如下：
- <img?class="lazy"?data-original="img/example.jpg"?width="640"?height="480">
結構里必須有data-original屬性，才可以實現延遲加載的效果！
首先給主題的header.php調用相關文件吧
- <script?type="text/javascript"?src="./jquery1.8.3.js"></script>
- <script?type="text/javascript"?src="./jquery.lazyload.js"></script>
- <script?type="text/javascript">
- $(document).ready(function(){
- $("img").lazyload({
- effect?:?"fadeIn"
- });
- });
- </script>
接下來要將正文圖片真實地址放在data-origina中，src地址放上我們設置的默認顯示的圖片。一一修改代碼既費時又費力，可以修改functions.php文件，自動替換成我們想要的內容
- function?lazyload($content)?{
- $loadimg_url=get_bloginfo('template_directory').'/img/img_loading.gif';
- if(!is_feed()||!is_robots)?{
- $content=preg_replace('/<img(.+)src=[\'"]([^\'"]+)[\'"](.*)>/i',"<img\$1data-original=\"\$2\"?src=\"$loadimg_url\"\$3>\n<noscript>\$0</noscript>",$content);
- }
- return?$content;
- }
- add_filter?('the_content',?'lazyload');
以上總結完畢：部分參考下載 ?jquery_lazyload-1.9.3
