內容目錄
什麼是Mega Menu超級菜單?
什麼是超級菜單呢？相比普通菜單而言，超級菜單的展示形式更加豐富，比如菜單裡帶有圖片、視頻、多列子菜單等等，譬如下圖就是一個超級菜單，實現它需要藉助插件。如果你還不會創建菜單，請先查看如何在WordPress中製作導航菜單（7個功能點）。
最受歡迎且免費的製作Mega Menu的插件
最受歡迎且免費的mega menu插件是Max Mega菜單，但它不適用於使用Elementor pro製作的header的菜單。
如果使用Elementor pro製作header，那麼需要用的另一個插件Elements Kit Elementor插件，它是Elementor的擴展組件，免費版就能提供mega menu功能。接下來我們用這個插件來講解mega menu的製作
如何製作超級菜單（Mega Menu）
安裝並啟用Elements Kit Elementor插件插件，若不會安裝插件，請查看這篇安裝插件教程
進入菜單頁面，如下圖所示，
- 選中Enable this menu for Megamenu content，
- 在需要設計mega menu的菜單上懸停，將浮現mega menu按鈕，點擊該按鈕
- 點擊mega menu按鈕後，將顯示下圖的彈出框，請將megamenu enabled開啟
- 然後點擊edit megamenu content，系統會彈出elementor編輯器，請在編輯器中製作megamenu的內容，就像用elementor製作頁面的方法一樣
如下圖所示，我隨意製作了一個mega menu實例，記得點擊update保存，然後點擊左上角的x關閉界面回到菜單頁面。
最後依次點擊彈出層上的save按鈕，點擊保存菜單。
接下來請將elementor的header模板中的導航元素換成Elements kit Elementor addons提供的導航元素，即下圖中帶有ekit標記的nav menu元素，否則megamenu也不能生效。
最後訪問網站看一下效果，如下圖所示，將鼠標放到products上，下方即刻浮現剛才製作的mega menu。
需要注意的是，megamenu不適合手機端，而Elements kit Elementor addons插件必須付費升級到PRO才能控製手機端不顯示megamenu，這並不意味著我們要付費。
我們可以通過elementor編輯header，新增一個setion放移動端的菜單，按下圖所示，用可見性開關控制菜單在不同設備上的可見性。譬如將有megamenu的菜單僅僅在桌面端可見；而沒有megamenu的菜單僅僅在平板和手機端可見，完美省錢?。