Mega Menus

Updated

Overview

Mega Menus are the dropdown panels that open from the header or mobile menu. Build each one in the block editor under Mega Menus → Add New Mega Menu.

The title is the default label on the menu item. The blocks are what visitors see in the panel. A mega menu has no page, archive, or search result of its own.

Starter layout

A new mega menu opens with:

  • A full-width Section
  • A wide Structured List set to Naked, Grid, and 3 columns
  • Six empty List Cards

You can change those block settings, or delete the starter blocks and add your own. Nothing is locked.

Panel width

Panel width is in the editor sidebar, on the Mega Menu tab.

  • Full width (the default): the panel spans the site's width under the header, as before.
  • Small, Medium or Large (about 320, 576 and 832 pixels): the panel opens as a white, rounded card that wide, centred under its menu item. Near the edge of the window it moves inward so it stays on screen.

The editor shows the panel at the width you pick, on a dark background, so what you see is what opens on the site. In a Small, Medium or Large panel, every block fills the card's width, including wide and full-width blocks.

On phones, every panel fills the screen under the header, whatever its width setting.

WordPress features

  • Supports: title, editor, revisions, Panel width
  • Archive: none
  • Public URL: none. Mega menus are left out of site search and have no page of their own
  • Featured image / excerpt: not used

Put it on the site

A published mega menu does nothing until you add it to a menu from the Mega Menus box under Appearance → Menus.

See Usage → Getting started for the attach steps and how the panel opens and closes.

Tips

  • Name the mega menu the way it should read in the nav, then rename the menu item only if you need a shorter label.
  • One mega menu can sit on both the desktop and mobile menus. They share the same panel.
  • Build the panel like a small page: Section for the background, Structured List or other blocks for the links.
  • For a short list of links, try Small with a plain list. Use Medium or Large for a few image cards, and keep Full width for big multi-column panels.
  • A Small card fits about one column. Set a Structured List to one or two columns there.

Built by Dirigible Studio. Get in touch