重點整理
Elementor 的 Nav Menu 選單小工具，2026 年在編輯器裡的名稱是「WordPress Menu」，仍是 Elementor Pro 的功能。做法分兩段：先在 WordPress 後台「外觀 → 選單」建立選單（6 個步驟），再到 Elementor 拖入小工具、選擇選單，調整水平、垂直、下拉三種版面與顏色、間距（11 個步驟）。
網站主選單、側邊欄的分類列表、頁尾的資訊連結，其實都是「選單」。用 Elementor 做版面時，選單小工具可以把你在 WordPress 後台建好的選單直接放進任何區塊，再用視覺化的方式調整排列、顏色和手機版的收合樣式。這篇先說明怎麼在 WordPress 建立選單，再一步一步示範 Elementor 選單小工具的設定。
Elementor 選單小工具是什麼？免費版能用嗎？
這個小工具早期叫「Nav Menu」，現在 Elementor 官方說明文件把它稱為「WordPress Menu」小工具，作用是讀取你在「外觀 → 選單」建立好的選單，再用 Elementor 的介面設計外觀。它屬於 Elementor Pro，只裝免費版的 Elementor 不會出現。另外 Elementor Pro 還有一個較新的「Menu」小工具，可以直接在編輯器裡建立選單項目和大型下拉選單（Mega Menu），適合要做複雜導覽的網站。
官方說明：Elementor WordPress Menu 小工具說明文件、Elementor 官方教學影片。
下面的截圖是較早期的 Elementor 介面，按鈕位置和名稱跟現在的版本略有不同，但設定項目（Layout、Pointer、Text Color、Padding、Dropdown）都還在。
WordPress 建立選單流程
如果你用的是 Hello Elementor、Astra 這類傳統佈景主題，選單在「外觀 → 選單」管理。（使用區塊佈景主題時，選單改在「外觀 → 編輯器 → 導覽」，但 Elementor 的選單小工具讀取的是傳統選單。）
步驟一：進入選單設定頁
到 WordPress 後台，點選左側「外觀 → 選單」。
步驟二：點選「建立選單」
在選單頁面上方點「建立選單」連結，新增一組選單。
步驟三：替選單命名
輸入選單名稱（例如 menu01），再按「建立選單」按鈕。名稱只給後台辨識用，訪客看不到。
步驟四：把頁面加入選單
依序操作：選取要編輯的選單 → 按「選取」→ 確認選單名稱 → 在左側勾選要加入的頁面 → 按「新增至選單」→ 確認右側選單結構正確 → 在「選單設定」勾選要顯示的位置（例如 Primary Menu）。
步驟五：儲存選單
確認無誤後，按右上角的「儲存選單」。
步驟六：確認選單已建立
頁面上方出現「選單 [menu01] 已更新」的提示，就代表選單建立成功。
Elementor 選單小工具設定步驟
步驟一：新增區塊
用 Elementor 編輯頁面或頁首範本，點畫面中的「+」新增區塊。
步驟二：選擇欄位結構
選擇需要的欄位數量。截圖是舊版的 Section（區段）；新版 Elementor 預設改用「容器（Container）」，點「+」後會先選 Flexbox 或 Grid，再選欄位結構，用法相同。
步驟三：拖入選單小工具
在左側小工具面板找到選單小工具（舊版中文介面顯示「導航選單」，新版搜尋「WordPress Menu」或「選單」即可），拖到剛剛建立的區塊裡。
步驟四：選擇要套用的選單
在「內容」分頁的 Menu 下拉選單，選擇剛剛建立的選單名稱，畫面會立刻顯示選單內容。
步驟五：水平排列
Layout 選擇 Horizontal，選單項目會橫向排列，適合網站頂部的主選單。
步驟六：垂直排列
Layout 改成 Vertical，選單項目會直向排列，常用在側邊欄或頁尾的連結列表。
步驟七：設定文字顏色
切到「樣式」分頁，在 Main Menu 的 Text Color 選擇選單文字顏色。上方的 NORMAL、HOVER、ACTIVE 可以分別設定一般、滑鼠移入、目前頁面三種狀態。
步驟八：調整項目間距
Horizontal Padding 控制每個選單項目左右的留白，數值越大間距越大；Vertical Padding 控制上下留白，Space Between 則是項目之間的距離。
步驟九：改成下拉收合選單
Layout 選擇 Dropdown，選單會收成一個漢堡圖示，點擊後才展開。手機版通常用這種樣式；也可以在 Mobile Dropdown 的 Breakpoint 設定在手機或平板寬度才自動切換。
步驟十：設定下拉選單的顏色
在「樣式」分頁的 Dropdown 區塊調整 Text Color、Background Color，控制展開後選單的文字與背景顏色。漢堡圖示本身的顏色則在 Toggle Button 區塊設定。
步驟十一：調整外距與位置
切到「進階」分頁，用外距（Margin）和內距（Padding）調整選單在區塊中的位置。截圖示範四邊外距都設為 28，選單上下多出空間。
選單通常放在頁首，搭配 Elementor Pro 的 Header 範本，就能讓全站共用同一個選單。做法可以參考 Elementor Header Templates 建立步驟。
常見問題
Elementor 免費版有選單小工具嗎？
沒有，Nav Menu（WordPress Menu）和新的 Menu 小工具都屬於 Elementor Pro。只用免費版的話，可以靠佈景主題內建的頁首選單，或在 Elementor 的「WordPress」小工具分類中使用 WordPress 原生的導覽選單小工具，但樣式設定比較少。
選單在 Elementor 裡選不到怎麼辦？
先確認選單已經在「外觀 → 選單」建立並按過「儲存選單」。存好後回到 Elementor 重新整理編輯器，Menu 下拉選單就會出現新選單。
手機版要怎麼讓選單變成漢堡選單？
在「內容」分頁的 Mobile Dropdown 設定 Breakpoint，選擇在手機或平板寬度切換成下拉選單。設定後用 Elementor 底部的響應式預覽切到手機模式檢查即可。
結語
Elementor 選單小工具的流程很固定：先在 WordPress 建立並儲存選單，再到 Elementor 選擇選單、設定水平、垂直或下拉版面，最後調整顏色與間距。新版雖然改名為 WordPress Menu、區塊也改用容器，但設定項目大致相同。如果網站需要大型下拉選單，再考慮改用 Elementor Pro 的 Menu 小工具。