Multi-level Menus

Tabule Theme supports menus with up to three levels of nesting: top-level items, dropdowns, and nested dropdowns (flyout panels).

How nesting works

In Appearance → Menus, drag a menu item to the right beneath a parent item to create a sub-menu. Drag it further right beneath a second-level item to create a third level.

Main Item (level 1)
  └── Sub Item (level 2)
        └── Nested Sub Item (level 3)

Desktop behavior

• Level 1 items — displayed in the header bar. Hovering reveals the dropdown panel if sub-items exist.
• Level 2 items — shown in a vertical dropdown panel below the parent. Items with their own children display an arrow indicator.
• Level 3 items — shown in a flyout panel that opens to the side of the level 2 item on hover.

The dropdown and flyout panels use a CSS grid layout that limits the top-level items to a fixed grid; sub-menu widths adapt automatically.

Customizing desktop menu appearance

All menu styling is in Appearance → Customize → Menu Settings:

• Menu Settings — controls top-level item colors, hover colors, font weight, border radius, and margin/padding for each side.
• Submenu Settings — controls dropdown panel background, item hover color, and font colors for second and third level items.

Mega menu / full-width dropdowns

The theme does not include a built-in mega menu. For complex navigation with images, columns, or featured content, consider a plugin such as Max Mega Menu.