圖片延遲載入已不是什麼新技術,而那天因為 wp super cache 一直秀鬥,手機與桌機版版型傻傻分不清楚,以及使用手機瀏覽時,卻出現電腦版,這讓網站在 Google 搜尋時,出現此網站不適合使用手機瀏覽,才讓我更換成 wp rocket 這套快照緩存插件,同時 wp rocket 這套快照緩存功能相當的強大,同時內建就有圖片延遲載入的功能,因此我就好奇,將它開啓沒想到網站開啓速度竟然秒快,讓我對圖片延遲載入有了不一樣的感受。
由於 wp rocket 則是將 WordPress 的所有 img 圖片標籤,會全面套用圖片延遲載入的效果,這也因此讓我先前所用的,使用前與使用後的效果立即失效,甚至就連滑入顯示原圖的特效也一樣,所以那一天我就研究了一下圖片延遲載入的作法,再將它加入排除的功能,讓有些圖片可以不要套用延遲載入,最後再花了點時間,將它寫成了 WordPress 的插件,因此有需要的朋友,現在也一塊來看看吧!
MWT-Lazy Load image
插件名稱:MWT-Lazy Load image
適用版本:WordPress 4.5+
插件下載:本站下載
適用版本:WordPress 4.5+
插件下載:本站下載
Step1
首先,下載並解壓縮後,再透過 FTP,將插件上傳到 plugins 的資料夾下。

Step2
接着進到 WordPress 後台,將它啓用,當啓用完畢後,不會產生任何的設定選項。

Step3
再回到 WordPress 的前台,滾動頁面時才會開始載入圖片,當圖片還沒載入時,就會出現載入的圖示。

Step4
當有圖片不要使用延遲載入時,只需在 img 加入class="dis-lazy-load",就可跳過延遲載入,透過延遲載入後,可讓網頁開啓的速度變更快,有用 WordPresss 的朋友,也趕快來安裝一下囉!

