如何讓大量圖片分批加載顯示？

最近的一個wordpress建站項目中，客戶要顯示的圖片非常多，超過了100張，如果全部顯示在一個頁面就不太好了，所以他們想給圖片添加一個加載更多的選項，點擊一次加載20個，直到顯示完。

需求分析

想要實現這個功能的方式不止一個，比如以文章的形式添加圖片，然后把目錄的翻頁效果修改為加載更多。但是客戶只想添加圖片，不需要寫文章，所以這樣的做法稍微麻煩了一些。

最后想來想去，最快捷的實現方法還是使用Elementor編輯器，這里會用到一個擴展插件的功能，插件名為Essential Addons，本實例中只需要用到該插件的免費功能，使用里面的Filterable Gallery模塊。

制作步驟

安裝好Essential Addons插件，用Elementor編輯頁面，添加Filterable Gallery模塊，然后在Load More Button選項中打開開關。另外還可以設置每點一次按鈕加載多少張圖片，這樣最核心的需求就已經實現了。

接下來就只需要添加圖片，可以在Gallery Items選項中添加圖片，如果圖片很多，這部分的工作量就挺大的。最后還可以做一些樣式的設置，其它設置項大家就自行探索吧。

實現效果

如上圖所示，悅然wordpress建站設置了默認顯示10張圖片，點擊按鈕后一次加載20張。

加載的效果如上圖所示。