Docs

Mega menus

Build rich dropdown menus with any widgets and attach them to menu items.

On this page

A mega menu is a large dropdown panel that opens from an item of your main menu, with columns of links, icons, images, a featured project or a call to action. You design the panel as a Mega menu template with any widgets, then attach it to a top-level menu item. The Nav Menu widget in your header then shows the panel instead of a plain list of sub-items.

The Northwind Studio header with the Services mega menu open: two columns of links with icons and a featured project image
The Services item opens a mega menu panel.

Build the panel

  1. Create the template

    Go to Urmi → Theme Builder → New template, choose Mega menu, name it (for example "Services menu") and click Create and open editor.

  2. Design the content

    Add a row container with columns. Icon List works well for groups of links; add a Heading above each group, an Image Box for a featured page, or a Button. Give the link columns a fixed width so they do not get squeezed by a wide image next to them.

  3. Publish

    Click Publish. Only published mega menus show on the site.

A mega menu template in the editor: a Services column and a Studio column of icon links next to an image box
Designing a mega menu panel.

Attach it to a menu item

  1. Open your menu

    In WordPress, go to Appearance → Menus and select the menu used by your header's Nav Menu widget.

  2. Open the menu item

    Click the arrow on a top-level item, for example "Services". Mega menus can only be attached to top-level items.

  3. Choose the panel

    In Urmi mega menu, pick your template (drafts are marked, and do not show until published). Choose the Panel width:

    Panel widthWhat it does
    Site containerAs wide as your site's content area, centered under the header.
    Full widthThe full width of the browser window.
    Fit contentAs wide as the panel's own content, under the menu item.

  4. Save

    Click Save Menu. To go back to a normal dropdown, choose — None (regular dropdown) —.

Note

Block themes normally hide Appearance → Menus. Urmi brings that screen back when a block theme is active, so you can manage menus and mega menus there with any theme. A connected AI assistant can also attach the panel, for example: "Use the Services menu template as the mega menu of the Services item in the main menu."

How it opens

  • The panel opens like any dropdown of the Nav Menu widget: on hover or on click, depending on its Open submenus on setting. It works with the keyboard too.
  • The mega menu replaces the item's sub-items. Keep the sub-items in the menu anyway if you like: they are not shown while a mega menu is attached.
  • In the mobile menu (below the widget's breakpoint), the panel's content shows inside the menu, under its item.
  • On multilingual sites, each language shows its own translation of the panel when there is one. See Multilingual sites.

In the Theme Builder, mega menus are listed under Reusable → Mega menus, with "Attached to menu items" in place of display conditions.

Nav Menu widgetMenus, dropdowns and the mobile menu. Headers & footersBuild the header that holds the menu. Theme Builder overviewEvery template type. AI & MCPLet an AI assistant build and attach menus.