前言

Elementor編輯器中的『WordPress Menu』是用來製作Header區裡面的「選單」，其設定設定的細節滿多的，設定時會分別為電腦版與手機版的樣式做不同的參數設定，這邊就把常常會設定的地方整理出來供參考教學。

設定細項

以下的描述都是針對『WordPress Menu』這個元素工具的說明，故你要設定的對象可不要選錯了，你需要進行頁首設計時在拖拉『WordPress Menu』至右邊空白區後，點擊『WordPress Menu』後再從左側進行設定。

【佈局】

把佈局展開，裡面有設定細項。

選單 : 要展示哪一組選單
佈局 : 水平、垂直、下拉
對齊 : 左、中、右、分散
指標 : 滑鼠移上去的醒目提示

>手機下拉

斷點 : 何時才把選項們縮合成「漢堡線」圖示
全寬 : 設成「是」(手機下拉時全寬)
開關對齊(漢堡線圖示) : 左、中、右

【樣式】

樣式，裡面有三大區設定，分別點開後再設定細項。

*主選單(電腦版樣式)

排版樣式 : 字體大小粗細
文本顏色 : 字體顏色
分隔線 : 決定是否幫每個選項加上分隔線。
指標寬度 : 滑鼠移上去的醒目提示的寬度
水平內距、垂直內距 : 控制選項上下左右的間距

*下拉 : (控制手機時選單選項的樣式)

文本顏色、背景顏色、排版樣式 : 同電腦版的設定方式，但需另設定一下(包含一般、懸停、啟動時)。
Border type : 手機時整個下拉區塊的四邊框線，有需要可以加設，或是純加陰影也可。
水平內距、垂直內距 : 控制選項上下左右的間距
分隔線 : 決定是否幫每個選項加上分隔線。
距離 : 整組手機選單展開後整個區塊上下的距離。

*切換按鈕 : (控制手機時收合圖示漢堡線的樣式)

顏色 : 切換按鈕的顏色。
背景色 : 切換按鈕的背景色，一般調成透明。

捲動網頁時”固定頁首”

整個「頁首」所在的Container的【進階】

z-index : 若網頁內容會蓋到選單，就把值設成999。
動作特效 : 黏貼，選「上」，就會讓網頁往下捲動時整個「頁首」固定。