購物車

購物車內沒有任何商品。

加入 WordPress 學習交流社團

為什麼要加入本社團?好處如下:

  1. 問題解答
  2. 免費教學
  3. 好用工具推薦
  4. 最新資訊
  5. 秘訣分享
  6. 資安通報
  7. 100+參考指引
立即加入
快速、安全及穩定的主機空間能提升網站 SEO 排名與使用者體驗

如何建立 WordPress 選單?從操作、類型到注意事項 (新手必讀)

選單是網頁最重要的元素之一,通常會出現在頁首區域,能幫助使用者大致了解網站主要內容,同時也包含搜尋引擎。本篇文章會說明如何新增選單,然後介紹幾種常見的選單類型以及注意事項。

什麼是 WordPress 選單?

以圖片的方式來說明可能會更直觀一些,以我的網站為例,你可以看到上方用紅色框選出來的區域就是 WordPress 選單,這種類型是最常見的。

如何建立 WordPress 選單?

新增選單的方法很簡單,只需 3 個步驟即可達成,如下:

步驟
建立選單

首先,前往 [外觀]→[選單] 然後命名選單的名稱,接著再點選 [建立選單] 按鈕。

選單名稱僅讓你在網站後台辨識用,不會顯示在網站前端,所以不用擔心使用者會看到。

步驟
新增與調整選單項目

在左側新增你想要的選單項目後,點選 [新增至選單] 按鈕。WordPress 選單預設的分類有頁面、文章、自訂連結及分類,這部分請熟記,因為當你安裝其它外掛後,可能會多出新的類別。

當你新增好選單項目後,可以透過拖曳的方式調整其順序 (上下) 與階層 (左右)。後者是建立下拉式選單的做法。

如果你要刪除某一個選單項目,可以先將其展開然後再點選左下角的移除;如果想要刪除的項目很多,請善用批次選取的功能,會更有效率一些。

步驟
決定顯示位置

最後,你可以指定選單要出現在哪裡。以 Astra 佈景主題為例,內建 5 種位置可供選擇,選好你要顯示的位置後再點選 [儲存選單] 即可。

選單的顯示位置不一定要勾選,取決於你是透過何種方式將選單呈現在網站上面。

WordPress 選單種類

選單會因為出現的場合或外觀不同而有不一樣的名稱。除了一般最常見的選單以外,還包含 Off Canvas 選單、全螢幕選單、複合式選單、行動裝置選單及圖文選單等等。

至於這些選單要如何製作,我會放在付費課程中做進一步的說明,有興趣的朋友可以參考一下,以下是對應的單元。

選單類型付費課程單元範例
一頁式選單一頁式選單保險經紀人業務員謝芊苹
Off Canvas 選單Off Canvas 選單驅動數位行銷
全螢幕選單全螢幕選單勞力士
複合式選單複合式選單Gandi
圖文選單如何設定資訊欄?Xserver
行動裝置選單如何設定頁尾?Think with Google

WordPress 選單重點整理

當你熟悉選單的各項操作與類型後,有一些技巧可以學習,整理如下:

WordPress 選單重點筆記
  1. 要先建立內容,才能新增選單項目 (自訂連結除外)。
  2. 建議新增首頁的選單項目,即使網站標誌可以連到首頁。
  3. 建議啟用固定式頁首功能,讓選單一直維持在網頁的上方。
  4. 自訂連結的使用時機有 2 個:
    • 如有子選單,上層選單的連結要設定成 # 字號。
    • 如果你想在選單新增外部網站連結 (像是社群),那麼你就只能透過自訂連結的方式處理。
  5. 如有子選單,上層選單要顯示箭頭圖示。
  6. 子選單的階層不要超過 2 層,如果資訊量過大,建議採用複合式選單。
  7. 可以新增「選單標籤」或「選單圖示」以抓住使用者目光。
  8. 選單除了能在 WordPress 網站後台新增,也可以在外觀自訂器上調整。

常見問題

列舉一些關於 WordPress 選單的常見問題。

請問如何將選單項目開新分頁?

在 WordPress 後台選單編輯頁面中的右上角找到 [顯示項目設定],勾選連結目標開啟方式後,你就能指定哪一個選單項目要開新分頁。

請問如何新增選單圖示?

你可以透過 WP Menu Icons 這款免費外掛實現或者購買 Astra Pro 解鎖。

請問如何新增選單標籤?

你可以透過 Astra Pro 實現這項功能。

如何新增行動裝置選單標籤?

Astra:前往外觀自訂器後,將編輯畫面改用行動裝置檢視,點選 [切換按紐] 元素並在選單標籤欄位新增。

Blocksy:前往外觀自訂器後,將編輯畫面改用行動裝置檢視,點選頁首後找到觸發器元素並在標籤可見度底下決定選單標籤要在何種裝置顯示。

請問如何在網站間移轉指定選單?

你可以使用 Export Import Menus 外掛處理。

結論

網站的選單就像是一本書的目錄,能夠幫助訪客以更有效率的方式查找站內的資料。若規劃得當,不僅可以提升使用者體驗,也能讓搜尋引擎了解網站整體的架構,進而使 SEO 排名變得更好。

加入 Facebook 社團
瀏覽次數: 1,319
SEO 服務

不滿意現有網站的流量嗎?網站排名始終無法超越進爭對手?如果你有這些煩惱,歡迎參考本站提供的 SEO 服務。

需要你的支持

如果你在本站有學習到東西,歡迎提供反饋,以便我們確認方向正確。當我們收到資料後,會另外幫你免費宣傳。你的支持是我們繼續創作的動力!

內容檢查清單

如果你想讓網站的內容更具競爭力,除了透過 SEO 外掛輔助外,也建議搭配我們所製作的內容檢查清單,內含 17 個檢查項目及 42 個最佳做法。此外,還會教你如何將檢查清單新增至 WordPress 網站上。

全方位學 Wordpress – 從架站到整合行銷 2.0
  • 講者 24 小時內親自回覆問題,安心有保障
  • 優先推薦免費工具,幫你省荷包
  • 只推自己正在用的付費工具,不會為了傭金讓你繞遠路,真實誠懇
  • 注重效能,畢竟這會影響使用者體驗與 SEO 排名
  • 數 10 種學習資料,非常豐富
  • N 個獨家資源
  • 定期分享最新資訊
  • 300+參考指引
  • 內容 & 範本資料庫 (獨創)
  • AI 驅動,有效提高工作效率
喜歡請分享!
wei
wei

協助中小企業提升網站在搜尋結果頁上的能見度,以便獲取更多流量進而增加成交機率。

開啟目錄