如何將其添加到您的網站
已發表: 2022-10-27想在 WordPress 中添加無限滾動?
無限滾動可確保您的頁面在每次訪問者到達頁面底部時自動加載新內容。 通過這種方式,您可以保持訪問者的參與度並降低網站的跳出率。
我們將向您展示如何將無限滾動添加到您的 WordPress 網站。 但首先,我們將介紹一些您應該了解的基本知識。 這篇帖子的大綱如下:
讓我們開始吧。
使用無限滾動,您的網站會在用戶向下滾動時加載新內容,而不是要求他們手動單擊鏈接以打開新頁面。
在 WordPress 上,一個常見的例子是在訪問者到達底部後自動在您的博客頁面上加載新帖子,而不是依賴分頁等其他技術。
該技術經常用於 Facebook 和 Twitter 等社交媒體平台,為用戶提供暢通無阻的瀏覽體驗。
並且可以在網站上使用相同的技術來保持訪問者與他們的互動。
你應該在你的網站上添加無限滾動嗎? 優點和缺點
儘管它可以對用戶參與度和瀏覽體驗產生積極影響,但無限滾動並不適合所有人。
讓我們看一下優缺點,以決定是否需要在您的 WordPress 網站上實施該技術。
使用無限滾動的優點
在您的網站上使用無限滾動的優點是:
使用無限滾動的缺點
在您的網站上使用無限滾動的缺點是:
- 當內容無縫更改時,瀏覽您的站點可能會造成混淆,並且很難知道您在哪個頁面上。
- 持續顯示內容,尤其是文本,可能會讓一些訪問者不知所措,他們可能會選擇離開您的網站並尋找競爭對手的網站。
- 您網站的頁腳 將變得多餘,因為訪問者永遠無法到達它。
- 快速滾動會使您的 Web 服務器不堪重負,從而導致您的站點凍結和崩潰。
- 有些工具可能會發現很難跟踪每個頁面的指標,因為無限滾動會使您的網站看起來像一個大頁面。
- 如果您的網站被視為一個連續的頁面,那麼它可能會對網站的SEO 和搜索排名產生負面影響。 不過,正確實現無限滾動可以避免這種情況,方法是仍然為每個頁面提供自己唯一的 URL。
這些是在您的網站上實施無限滾動的利弊。 考慮到這些之後,如果您仍想為您的 WordPress 網站添加無限滾動功能,請繼續閱讀。
您可以通過兩種不同的方式向您的 WordPress 網站添加無限滾動:
- 使用支持無限滾動的 WordPress 主題
- 使用無限滾動插件
讓我們深入研究每種方法,您可以實施適合您的方法。
但在開始之前,請備份整個網站,因為實現無限滾動需要您更改主題並在網站中安裝新插件。 執行這些步驟涉及一定的風險,您可能會發現您的網站因一個失誤而崩潰。 在這種情況下,備份將是您的安全網,因此請進行備份。
1. 使用 WordPress 主題添加無限滾動 (Neve)
Neve 是為數不多的提供無限滾動功能的免費WordPress 主題之一。 如果您希望僅在您的博客列表頁面(或其他存檔頁面)上啟用無限滾動,這是一個理想的解決方案。
使用 Neve 啟用無限滾動非常簡單。
在您的 WordPress 網站上安裝並激活主題。
然後轉到外觀 → 自定義 → 佈局 → 博客/存檔。
向下滾動到Ordering and Content選項,然後選擇Post Pagination下的Infinite Scroll 。
點擊發布按鈕以保存您的設置。

但是,如果您想在個人帖子或頁面上啟用無限滾動,則需要使用插件。 也就是說,當有人打開完整的單個博客文章頁面並滾動到底部時,您希望您的網站加載另一篇完整的文章。
在接下來的兩節中,我們將向您展示如何使用插件來實現無限滾動。
2. 使用 WordPress 無限滾動插件
有許多插件可以幫助您在網站上實現無限滾動,但最受歡迎的是:
- 捕捉無限捲軸
- YITH 無限滾動
- Ajax 加載更多
在向您展示如何使用它們之前,讓我們快速瀏覽一下每個插件。
捕捉無限捲軸
Catch Infinite Scroll 是一個簡單且免費的無限滾動插件,可讓您在單個頁面上水平顯示您網站的內容。
如果您將觸發器更改為單擊而不是滾動,它將在您的網站上添加一個加載更多按鈕。

自定義是可能的,您可以選擇更改加載圖像和加載更多按鈕上的顏色、字體大小和字體系列等。
免費版本允許您在您的網站上啟用無限滾動。 但是,要能夠更改顏色、字體系列和字體大小,您需要以 24.99 美元的年費獲得高級版本。
要使用免費插件,您只需在您的網站上安裝並激活插件即可。
通過轉到 WordPress 儀表板上的Catch Infinite Scroll ,您可以上傳新的加載圖像,並更改加載更多文本和沒有更多內容可顯示時出現的文本。

YITH 無限滾動
YITH Infinite Scrolling 是一個免費插件,與之前的插件一樣,YITH Infinite Scrolling 還提供了選擇分頁類型的選項——無限滾動或加載更多按鈕。
您可以更改加載更多按鈕文本,向按鈕添加額外的類,甚至可以使用動畫(如淡入、滑入)來加載新內容。
有許多加載圖像可供選擇以及上傳您自己的選項。
我們最喜歡的兩個功能是在移動設備上啟用或禁用無限滾動的選項,以及在加載新項目時更改頁面 URL 的選項(對 SEO 很重要)。
使用插件的免費版本,您只能做兩件事:
- 上傳自定義加載圖像。
- 僅在您的帖子上啟用無限滾動。
要在所有存檔頁面上啟用無限滾動並訪問插件的每個功能,您需要插件的高級版本,每年收費 59.99 美元。
使用 YITH Infinite Scrolling 非常簡單。 只需在您的網站上安裝並激活免費插件,它就會在您的帖子上實現無限滾動。
您可以導航到YITH → Infinite Scrolling來自定義插件配置,但默認設置工作得很好。

Ajax 加載更多
Ajax Load More 是一個複雜的插件,允許您啟用無限滾動以及 AJAX 過濾、轉發器模板、簡碼生成器、自定義查詢等選項。
與之前的插件相比,Ajax Load More 的設置要復雜一些。 雖然您無需成為開發人員即可使用它,但初學者可能希望堅持使用不同的插件,因為您需要處理諸如“查詢參數”和“轉發器模板”之類的術語。
但是,增加複雜性的好處是您可以獲得大量選項來配置和自定義站點上的無限滾動行為。
因此,如果您希望能夠無限滾動網站上的所有內容,從帖子到頁面、評論等等,這可能是一個不錯的選擇。
開始使用 WordPress 無限滾動
在您的 WordPress 網站上添加無限滾動有很多好處和缺點。 例如,它可以提高您網站的跳出率和排名,但在某些情況下也會對用戶體驗產生負面影響。
可以使用 Neve 主題或專用插件(如 Catch Infinite Scroll 和 YITH Infinite Scrolling)在您的網站上啟用無限滾動。 在實施任何方法之前,請確保有一個備份作為安全網。
有關改進網站的其他一些方法,請查看我們改善用戶體驗的七個技巧。
這就是全部! 如果您對如何在 WordPress 網站上添加無限滾動有任何疑問,請在下面的評論中告訴我們。