如何在 WordPress 帖子中添加閱讀進度欄

您是否注意到一些熱門網站如何在其文章頂部顯示閱讀進度條指示器?

這個小欄向用戶顯示文章還有多少內容需要滾動,并鼓勵他們繼續閱讀。它可以幫助您網站上的訪問者繼續閱讀您的內容并改善整體用戶體驗。

在本文中,我們將向您展示如何在 WordPress 帖子中添加閱讀進度條。

如何在 WordPress 帖子中添加閱讀進度欄

為什么以及何時應該在 WordPress 中添加閱讀進度欄

用戶在決定是留下還是離開之前只在網頁上花費幾秒鐘。如果您發布長篇文章,保持用戶參與會變得更具挑戰性,因為它們需要用戶向下滾動。

一些網站所有者添加內聯相關帖子,而其他網站所有者則使用視頻或圖片庫來將用戶留在頁面上。

閱讀進度條增加了一些用戶界面增強功能,鼓勵用戶向下滾動。它還激勵用戶完成他們正在閱讀的文章。

許多受歡迎的網站喜歡使用閱讀進度指示器來吸引讀者。但是,您還需要確保閱讀進度指示器很微妙,并且不會分散對內容本身的注意力。

話雖如此,讓我們看看如何輕松地為 WordPress 帖子添加閱讀進度指示器。

視頻教程

https://www.youtube.com/embed/XP_K51EMV4E?version=3&rel=0&fs=1&showsearch=0&showinfo=1&iv_load_policy=1&wmode=transparent訂閱 WPBeginner

https://www.youtube.com/subscribe_embed?usegapi=1&channel=wpbeginner&layout=default&count=default&origin=https%3A%2F%2Fwpbeginner.com&gsrc=3p&ic=1&jsh=m%3B%2F_%2Fscs%2Fapps-Static%2F_%2Fjs%2Fk%3Doz.gapi.en.vQiXRrxCe40.O%2Fam%3DAQ%2Fd%3D1%2Frs%3DAGLTcCMBxIGVyXSdvvcs43a64yHt_P7dfg%2Fm%3D__features__#_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart%2Concircled%2Cdrefresh%2Cerefresh&id=I0_1448178294715&parent=https%3A%2F%2Fwpbeginner.com

如果您更喜歡書面說明,請繼續閱讀。

在 WordPress 帖子中添加閱讀進度條

在博客文章和頁面中顯示閱讀進度條的最簡單方法是通過像Worth The Read這樣的插件。

它是一個免費的WordPress 插件,重量輕,有助于向您的網站添加閱讀進度條。該插件提供了多種自定義選項,可讓您更改其樣式以適合您的網站主題。您甚至可以用它來顯示文章的閱讀時間。

您需要做的第一件事是安裝并激活值得閱讀插件。有關更多詳細信息,請參閱我們有關如何安裝 WordPress 插件的分步指南。

激活后,您需要從 WordPress 管理面板訪問“值得一讀”?“進度”頁面,然后轉到“功能”選項卡來設置進度條指示器。

接下來,您可以選擇是否在帖子、頁面和主頁上顯示進度條。還有一個選項可以在自定義帖子類型上顯示閱讀欄。

如何在 WordPress 帖子中添加閱讀進度欄

如果向下滾動,您會發現更多自定義選項。

您可以通過啟用“包含評論”選項在進度條的總長度中包含評論。如果您要添加評論,那么您還可以為評論進度區域選擇不同的背景顏色。

該插件還允許您選擇閱讀進度條的位置。默認選項位于大多數網站使用的頂部。您可以將其更改為在頁面的右側、左側或底部顯示進度條。

如何在 WordPress 帖子中添加閱讀進度欄

除此之外,還有更多自定義閱讀進度條的選項。

例如,您可以將進度條從右向左移動、使用固定不透明度、為手機和平板電腦等觸摸設備啟用進度條、啟用調試模式等等。

完成后,不要忘記單擊“保存更改”按鈕。

接下來,轉到“閱讀進度”下的“樣式”選項卡,編輯閱讀進度欄的外觀。

如何在 WordPress 帖子中添加閱讀進度欄

該插件允許您選擇進度條的粗細并選擇前景色和背景色以匹配您的WordPress 主題。

背景色用于填充空白進度條,前景色用于在用戶向下滾動時顯示進度。

它甚至允許您使用進度條的透明背景。選中此選項將覆蓋背景顏色選項,并且當用戶向下滾動文章時僅顯示前景色。

編輯樣式后,不要忘記保存更改以存儲您的設置。

您現在可以訪問網站上的任何博客文章或登錄頁面,以查看正在運行的進度條。

如何在 WordPress 帖子中添加閱讀進度欄

我們希望這篇文章能幫助您在 WordPress 中添加閱讀進度條。您可能還想查看我們的最佳 WooCommerce 插件列表以及如何選擇最佳的網頁設計軟件。

? 版權聲明
THE END
喜歡就支持一下吧
點贊5 分享