Using Mega Menus

1 min read Documentation

If you have a large number of navigation items mega menus are great for displaying them in a column-like fashion. They’re incredibly easy to use, just follow the simple steps below and make sure to review the screenshot as well.

Creating a Mega Menu

  1. Go into Appearance > Menus
  2. Select your Primary Menu
  3. Expand one of your items that have children
  4. Check the “Multi-Column Menu” option
  5. It automatically enters 3, however, you can set this to anything from 2-6
  6. Save Menu
  7. You’re all set

Adding Optional Column Headings

As you can see in the example screenshot it uses column headings which are completely optional.

  1. Click the “Screen Options” tab in the top right (screenshot)
  2. Find “CSS Classes” under “Show advanced menu properties” check that box (screenshot)
  3. Now create a “Custom Link” with the URL of # and the label whatever you’d like > Add to Menu
  4. Then drag that to wherever your current menu item children are and organize the child items you want under that heading
  5. You’ll just repeat those steps for however many columns and items you have.
  6. IMPORTANT: For each Heading, you’ll want to add “col-title” under CSS Classes (screenshot)