fbpx
Cloudways 主機【8折】專屬優惠

解決 WordPress 佈景主題底部不提供「回到頂端 Back to Top」按鈕的問題

在網站設計的領域,主打「文章」為主的部落格應該佔了最大份額的比例。根據您管理的網站類型,你可能會提供短文格式或長文格式的文章內容,我們這次討論一個「貼心」的小功能,你可否曾經有過這樣的經驗,就是當你閱讀一篇 5,000 至 1 萬字左右的長篇文章,當你閱讀到中段或接近完結時,如果你需要回到網站的最上部,你需要拉動網頁捲軸到頁首的位置,這非常不方便和花費時間。此時,如果你網站右下方有一個「返回最上 Back to Top」的按鈕,他 / 她們就可以輕鬆一按回到網站頂端。

WordPress 外掛名稱:To Top 簡介

WordPress 外掛名稱:To Top 簡介
WordPress 外掛名稱:To Top 簡介

隨著愈來愈多專業的 WordPress 佈景主題內建「回到頂端 Back to Top」按鈕,這類小功能的外掛可能不再需要存在在市場裡,不過在【學習社團】的確不時會有新手發問這個問題,原因一般是他們使用免費的主題,功能比較貧乏。這正正是適合安裝這類外掛的合適時機,加上外掛非常輕盈和不佔主機資源,沒有過多多餘的功能,To Top 外掛是市場上不錯的選擇。

如何【安裝】To Top 外掛?

如何【安裝】To Top 外掛?
如何【安裝】To Top 外掛?

步驟一

在您的 WordPress 網站後台,在【外掛】裡選擇【安裝外掛】。

步驟二

進入【安裝外掛】的介面,在右方的(搜尋欄位)輸入【To Top】。

步驟三

稍等片刻,您會看到【To Top】的外掛資訊出現,請確保是如圖中的那個外掛。

如何【啟用】To Top 外掛?

如何【啟用】To Top 外掛?
如何【啟用】To Top 外掛?

步驟一

在您的 WordPress 網站後台,在【外掛】裡選擇【已安裝外掛】。

步驟二

從外掛清單之中,找到免費版的【To Top】的外掛,並按下【啟用】,這代表您希望使用 To Top 作為您其中之一個區塊功能和工具包。

如何【刪除】To Top 外掛?

如何【刪除】To Top 外掛?
如何【刪除】To Top 外掛?

步驟一

在您的 WordPress 網站後台,在【外掛】裡選擇【已安裝的外掛】。

步驟二

從外掛清單之中,找到免費版的【To Top】的外掛,並按下【刪除】,這代表您希望終止使用 To Top 作為您其中之一個區塊功能和工具包。

外掛缺點:廣告信息有點太多!

外掛缺點:廣告信息有點太多!
外掛缺點:廣告信息有點太多!

剛安裝完外掛,在介面下方一堆信息不知是什麼?仔細研究後原來是「廣告信息」,不過擺放位置比較容易誤導新手。不過廠方如果需要繼續提供免費的功能和更新,這種商業曝光和廣告也屬於合理的範圍,算是互惠互助的表現。

To Top 外掛的特色

To Top 外掛的特色
To Top 外掛的特色

支援全部 WordPress 佈景主題 (理論上)

網站管理員不必擔心網站安裝了略微不同或複雜功能的佈景主題,這個外掛支援全部 WordPress 佈景主題,並能讓網站更引人注目、更加有趣。

非常輕量化的小型外掛

這個外掛十分輕量化,網站管理員不須擔心它會耗用網站儲存空間及影響網站速度。

提供優異的技術支援

我們有優異的技術支援團隊及相關線上說明,使用者不須擔心外掛的使用方式,遇到問題時造訪技術支援論壇即可。此外,如果網站需要進階客製化,可以與我們洽詢短期雇用佈景主題開發者。

基本設定:調整出現條件

基本設定:調整出現條件
基本設定:調整出現條件

設定 1:捲動偏移量 (px) – 建議使用預設值

預設值是 100px,這代表當瀏覽者瀏動少許內容,就會出現「返回最上」的按鈕。

設定 2:圖示不透明度 (%) – 建議使用預設值

50% 代表半透明,這盡可能不騷擾讀者的閱讀體驗和心情,不容更改。

設定 3:按鈕的樣式

分別由 3 家供應商如 Dashicons、Genericons 和 Font Awesome 提供,當然您可以使用自家的圖片。

圖示設定 – 大小 / 色彩 / 類型

圖示設定 - 大小 / 色彩 / 類型
圖示設定 – 大小 / 色彩 / 類型

設定 1:選取圖示類型

3 選 1 的圖案,隨自己喜好。

設定 2:圖示色彩

請調整成你的商標品牌建議色彩。

設定 3:圖示背景色彩

請調整成你的商標品牌建議色彩。

設定 4:圖示尺寸 (px) – 建議使用預設值

50% 代表半透明,這盡可能不騷擾讀者的閱讀體驗和心情,不容更改。

設定 5:框線圓角半徑 (%)- 建議使用預設值

備注:設定為 0 會讓圖示背景成為正方形,設定為 50 會讓圖示背景成為圓形。

進階設定:客制化選項

解決 WordPress 佈景主題底部不提供「返回最上 Back to Top」按鈕的問題
解決 WordPress 佈景主題底部不提供「返回最上 Back to Top」按鈕的問題

設定 1:位置

可以選擇「左上方」、「右上方」、「左下方」和「右下方」。

設定 2:邊界水平位置 (px) – 建議使用預設值

預設是「20 px」,按需要調整數值。

設定 3:邊界垂直位置 (px) – 建議使用預設值

預設是「20 px」,按需要調整數值。

設定 4:圖示顯示於管理後台 – 建議使用預設值

啟用這項設定後,按鈕會顯示於管理後台。

設定 5:啟用自動隱藏 – 建議使用預設值

按自己的需求,沒有限定。

設定 6:自動隱藏時間 (秒)

啟用這項設定後,按鈕會在指定時間後自動隱藏。

設定 7:在小螢幕裝置隱藏圖示

啟用這項設定後,按鈕會在符合下方寬度設定的小螢幕裝置隱藏。

設定 8:小螢幕裝置最大寬度 – 建議使用預設值

啟用這項設定後,按鈕會在小於或等於螢幕寬度的裝置隱藏。

重設設定和停用 Catch 系列外掛:

解決 WordPress 佈景主題底部不提供「返回最上 Back to Top」按鈕的問題
重設設定和停用 Catch 系列外掛:

設定 1:重設全部設定

使用這項功能便會將全部設定重設為預設值警告: 這項操作會清除全部外掛資料。

設定 2:[Catch Themes] 及 [Catch Plugins] 分頁設定

如果網站管理員要在 [安裝佈景主題] 及 [安裝外掛] 頁面停用 [Catch Themes] 及 [Catch Plugins] 分頁,請停用以下選項。

完成,查看「返回最上」展示效果

解決 WordPress 佈景主題底部不提供「返回最上 Back to Top」按鈕的問題
完成,查看「返回最上」展示效果

常見問題 FAQ

To Top 外掛是免費的嗎?

這套「返回最上 Back to Top」完全免費,也沒有任何升級的選項,請放心使用。

什麼時候需要使用「返回頂端 Back to Top」外掛?

如果你的 WordPress 佈景主題並不支援這個功能,通常出現在免費主題之上,請瀏覽我們推薦的佈景主題介紹。

如果我遇到使用上的問題,可以去什麼地方發問和查詢?

請到我們的 WordPress 學習社團查詢和了解更多教學。

參考資料和引用文獻:

立即訂閱我們的網站

我們的團隊並不會濫發信息和廣告,每月定期會整理優惠和 WordPress 相關的更新情報,例如系統、外掛和佈景主題相關的更新,也會推送資訊安全的漏洞注要事項,確保您的網站保持和世界的連繫。

加入免費學習社團

學員人數:4,400+ 人(持續增加之中)

中文語系的 WordPress - Facebook 社團列表

發表您的留言

加入我們的 Facebook 學習社團免費的教學資源、交流和解決問題!

是否覺得孤軍作戰和學習很無趣味?
何不加入學習社團和其他
熱愛網站設計的朋友交流?
分享您建站的喜與樂
學習最新的知識和技術