您想在WordPress上添加無限滾動嗎?

還有什麼比Facebook的新聞提要更令人上癮的嗎? 我的意思是,我坐在這裡寫這個教程,但這個令人上癮的功能只是不斷滾動......再次......再次。

這是Facebook使用的功能,稱為:“ 無限滾動 “或” 無休止的滾動,用於新聞提要。 無需點擊按鈕或“ suivant “或者” 閱讀更多 ”,當您向下滾動頁面時,內容將繼續加載。

在WordPress上添加無限滾動

你猜怎麼著? 通過添加無限滾動,您可以在WordPress博客上實現相同的效果。

在本教程中,我將討論無限滾動的一些利弊,然後向您展示如何在WordPress博客上設置無限滾動。

但是之前,如果您從未安裝過WordPress發現 如何安裝WordPress博客7步驟 et 如何找到,安裝和你的博客激活WordPress主題 

然後回到為什麼我們在這裡。

無限滾動的優勢

許多大品牌都嘗試了無限滾動,這使我們能夠檢查其數據。 以下是社交網絡所帶來的一些好處:

順便發現 如何在Divi上創建滾動文本

  • 更多觀點 -NBC新聞發現,座機用戶通過無限滾動每次訪問增加了20%的頁面。 同樣, 時 “還發現21%的用戶選擇了無限滾動的其餘內容。
  • 跳出率極低  -“  當他們選擇無限滾動時,還會降低其15%的跳出率。
  • 改善用戶體驗 -大家都同意。 一些專家指出 無限滾動 UX可以提高用戶的內容展示率,迫使用戶減少點擊次數,同時提供更好的移動體驗。

我不能肯定地說您將獲得與這些頂級品牌相同的結果,但是如果您有很多博客文章,滾動無疑將是一個不錯的選擇。

發現 何時以及如何在子目錄中安裝WordPress

由於這些相同的原因,大多數社交網絡都依賴無限滾動。

無限滾動的缺點

無限滾動時,一切並不總是那麼樂觀。 當然,您應該考慮一些潛在的負面因素:

  • 沒有頁腳 -選擇無限滾動時,您將失去頁腳。 如果您想在頁腳中提供更多信息,將是一個很大的障礙。 例如,如果您使用頁腳來顯示會員信息,則需要找到一種新的方式來顯示該信息。
  • 滾動條彈跳會導致不良的體驗  -由於網站始終處於加載狀態,因此加載欄的長度很可能會發生變化,這可能會導致您失去閱讀進度,從而導致不良的用戶體驗。
  • 沒有“完成”的感覺 -這不是影射。 尼爾森研究人員發現,用戶到達頁面末尾時會感到一種完成感。 無限滾動使這不可能。

另外,在“好處”部分中,當您有很多同樣重要的博客文章時,無限滾動非常有用。 好吧,相反的情況也是如此:

另請參閱本文 如何修復WordPress上的“臨時文件夾丟失”錯誤

如果您的物品不重要,例如,有些文章最多包含2.000個單詞,而有些文章最多包含300個單詞),因此無限滾動對於您的網站來說絕對不是一個好主意。

如何添加WordPress的無限滾動

要在WordPress上添加無限滾動,您可以使用一個名為“ Ajax Loader更多 “。 該插件提供了大量高級擴展,可以增強其功能,但是免費版本應該足以向您的網站添加無限滾動。

進一步諮詢 WordPress上的Javascript:AJAX用例

基本插件通過生成添加到頁面的簡碼來工作。 然後,此頁面以無限滾動方式顯示您的博客文章。 在整個課程中,您還需要完成一些其他小步驟。 這是將其放置到位的方法:

安裝插件的配置

您可以找到“ Ajax Loader更多 » 在目錄上 WordPress插件. 像任何其他插件一樣安裝和激活插件。

激活後,您將看到一個全新的選項“ Ajax加載更多 “。 轉到“ Ajax加載更多>→轉發器模板 創建模型。

« 您的模型>中繼器 是定義文章在無限滾動中應如何顯示的模板。 您可以更改它,但是您需要了解一點PHP。 但是,默認模闆對於大多數用戶來說應該沒問題:

建設囤模型,WordPress的

唯一需要注意的是默認的“ Repeater”模板將僅顯示文章摘錄,而不是完整的文章。 如果要顯示全文,則必須替換“ the_excerpt() 通過“ 內容() “。

如果您知道PHP,仍然可以自定義此模型。 否則,可以離開模型“ 中繼器 默認情況下。

另請閱讀我們的文章 9個WordPress插件可在博客上創建價格網格

您可以在此處配置很多東西。 您可以選擇更改無限滾動中顯示的內容以及它們的行為方式。

我無法在本文中列舉所有可能性,但是下面是您肯定要填寫的一些方框:

  • post_type -默認為僅包含文章。 但是您還可以包括自定義頁面或帖子格式。
  • 類別 -您只能包括某些類別,或者不能排除某些類別。
  • 作者 -這是一個有趣的功能,您可以在其中為特定作者添加無限滾動。
  • posts_per_page -定義“ Ajax Loader更多 每次刷新應充電。
  • 暫停 -這當然是重要的元素。 對於真正的無限滾動,您應該在此處將其設置為“ false”。 否則,用戶將不得不單擊以調出其他文章。
  • 滾動 -重要的是啟用此功能,以便在用戶向下滾動頁面時自動加載文章。

發現我們的 播客的5個WordPress主題

完成所有配置後,複製 SHORTCODE 在頁面右側:

複製簡碼阿賈克斯裝載機,更

您需要做的就是將此簡短代碼添加到希望無限滾動出現的頁面上。 例如,您可以將其添加到名為“ 博客 使其成為您的默認博客頁面。

還發現一些高級WordPress插件  

您可以使用其他 WordPress插件 賦予現代外觀並優化您的博客或網站的處理。

我們在這里為您提供了一些高級WordPress插件,它們將幫助您實現這一目標。

1. YouTube和Vimeo分頁畫廊

這個高級WordPress插件是具有許多完全可配置功能的響應式和移動圖庫。 它可以顯示來自YouTube播放列表,關鍵字的視頻,也可以按Vimeo的專輯,頻道,組或關鍵字進行搜索。 可以通過幾種方式對網格進行個性化設置。 燈箱圖庫可以向播放器顯示視頻的所有詳細信息,包括評論。

Youtube Vimeo分頁畫廊插件WordPress

此WordPress插件可以在任何帖子或頁面區域中使用短代碼使用,也可以直接在PHP頁面中使用。 您所需要做的就是創建一個新畫廊,添加YouTube頻道ID,例如,並生成一個簡碼。 可以在同一頁面上使用多個圖庫。

下載 | DEMO | 虛擬主機

2。 無限的WooCommerce Scroll和Ajax分頁

WooCommerce 無限滾動和 Ajax 分頁是 WordPress插件 (WooCommerce) 高級版,有助於將默認產品分頁轉換為無限制滾動或 Ajax 分頁。 當用戶向下滾動頁面時,將自動檢索並添加下一個產品頁面。 這意味著他不需要單擊“下一頁”。 

無限的WooCommerce滾動和Ajax分頁

您還可以添加“加載更多”按鈕,而不是無限滾動,或者可以保留默認的分頁並將其轉換為Ajax分頁。

還要讀: 5 WordPress插件將表單插入您的網站

此外,您可以為移動設備設置不同類型的頁面調度,例如大屏幕設備的無限制滾動和移動設備的“加載更多”按鈕。

下載 | DEMO | 虛擬主機

3. 滑塊革命

Slider Revolution是一個創新且響應迅速的WordPress輪播插件,可以精美地顯示您的內容。 無論是滑塊還是旋轉木馬, 他的視覺編輯器拖放 例如,它將使您能夠講述公司的歷史,突出您的最佳產品,最佳文章以及更多內容

最佳滑塊WordPress插件-滑塊革命

我們還邀請您發現我們的 9 Easy Digital Downloads插件可管理數字下載

其功能包括:出色的幻燈片創建界面,拖放幻燈片設計,完全響應的佈局, 完善的多媒體內容管理, 優化性能, 多語言支持,提供近 340 個圖形元素,提供大量幻燈片模板,兼容大多數 WordPress主題,出色的客戶支持,對觸摸屏的支持, 免費定期更新,可用的文檔和視頻教程等等。

下載 | DEMO虛擬主機

推薦資源

查找有關其他推薦資源的信息,以幫助您構建和管理網站。

結論

就是這樣! 這就是本教程的全部內容,現在您可以在WordPress博客上設置無限滾動。 不要猶豫 與您喜歡的社交網絡上的朋友分享

但是,您也可以諮詢我們的 RESSOURCES,如果您需要更多的元素來執行創建Internet網站的項目,請參考我們關於 WordPress博客創建。

如果您有任何建議或意見,請將其留在我們的部分 評論.

... 

別起來Pinterest上