MegaMenu – multicolumn menu

A mega menu, sometimes also called a mega drop-down menu, is designed to enhance scannability and categorization of its contents. PrimeFaces' mega menu is a horizontal navigation component that displays menu items grouped in submenus. The main advantage of such a kind of menu is that everything is visible at once—no scrolling is required.

In this recipe, we will design and implement a mega menu for an imaginary online shop selling clothes.

How to do it...

The layout of the MegaMenu component is grid-based. That means, root items require columns as children to define each section in a grid. Root items are direct submenus below p:megaMenu.

We will design four root items. The first one will show women's clothing, the second ...

Get PrimeFaces Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.