Studio Two 編輯器：網站選單設計
此文章適用於新版 Studio Two 編輯器，該編輯器已於 2026 年 11 月發布。若不確定目前使用的是 Studio 編輯器還是 Studio Two 編輯器，請在此查看詳細資訊。
在 Studio Two 編輯器中，可使用檢驗器面板微調選單設計。分別自訂各種狀態，包括固定、游標懸停、選擇或目前頁面，並調整填滿色彩、文字樣式、陰影等設定。
橫向與垂直選單設計
使用檢驗器面板，分別設計橫向與垂直選單的各種狀態：固定、游標懸停和選擇。自訂這些狀態可為訪客打造更具互動性的導覽體驗。
可用的設計選項取決於所選的選單預設格式。使用這些選項讓選單符合網站的外觀和形象，包括按鈕或分隔線等可自訂元件。
可用的設定取決於從「新增元件」面板選擇的特定選單。
若要設計橫向或垂直選單：
點擊畫布上的選單。
點擊編輯器右上方的「開啟檢驗器」圖示
。點擊「設計」索引標籤。
在 「選擇設計項目」下方選取要設計的元件，例如選單列、選單項目、下拉式選單、捲動按鈕。
選擇相關狀態：一般、游標懸停或已選擇。
使用以下選項設計選單：
填滿：變更背景、圖示或覆蓋層色彩。
框線：新增或調整框線。
邊角：將邊角調整得更方正或圓潤。
陰影：新增陰影，營造立體感。
間距：調整項目周圍及項目之間的空間。
行為：控制選單如何配合網站的文字方向，以及選單項目的排列位置。
位置：設定位置類型和邊距。
外觀：調整不透明度和旋轉角度。
游標：使用圖片或 SVG 新增自訂游標。
錨點：新增錨點，讓訪客可直接連結至此區域。
自訂 CSS：新增自訂 CSS，取得更進階的設計控制。
漢堡選單設計
漢堡選單有 2 種可自訂的檢視：一般模式和漢堡選單。一般模式可控制頁面上已關閉的選單圖示，漢堡選單則可控制訪客開啟選單後看到的內容。
漢堡選單設計
點擊畫布上的漢堡選單。
點擊模式下拉式選單，然後選擇要自訂的模式：一般模式或漢堡選單。
使用可用選項自訂模式：
一般模式：
選擇要設計的部分：點擊下拉式選單，然後選擇漢堡按鈕或圖示。
選擇狀態：選擇相關狀態，例如一般或游標懸停。
自訂設計：使用可用選項調整外觀和版面配置：
大小：調整漢堡選單的大小。
填滿：變更背景、圖示或覆蓋層的色彩。
框線：新增或調整框線。
圓角：調整圓角，使其更方正或圓潤。
陰影：新增陰影效果。
間距：調整項目周圍及項目之間的空間。
行為：控制選單如何配合網站方向，以及項目的排列位置。
位置：設定位置類型和邊距。
外觀：調整不透明度和旋轉角度。
游標：使用圖片或 SVG 新增自訂游標。
自訂 CSS：新增自訂 CSS，進一步控制設計。
漢堡選單：
選擇要設計的部分：在選擇要設計的內容下方選擇相關部分：
漢堡選單：自訂訪客點擊漢堡選單時開啟的容器。
關閉按鈕：自訂訪客用來關閉選單的圖示。
圖示：自訂圖示設計。
選擇狀態：選擇相關狀態，例如一般、游標懸停或停用。可用狀態取決於所選的部分。
自訂設計：使用可用選項調整外觀和版面配置：
填滿：變更背景、圖示或覆蓋層的色彩。
框線：新增或調整框線。
圓角：調整圓角，使其更方正或圓潤。
陰影：新增陰影效果。
間距：調整項目周圍及項目之間的空間。
行為：控制選單如何配合網站方向，以及項目的排列位置。
