- The "mega menu" option aligns with the Public Affairs branding guidelines.
- Photos added/uploaded to the Mega Menu may be cropped and scaled in order to fit the appropriate aspect ratio. For more information on this, please see Image Shapes and Sizes.
About the Mega Menu
By default, the menus in the Open Berkeley theme have a simple drop-down functionality (similar to the previous theme). The theme also has a "mega menu" option (see the Web Accessibility website for an example of how the mega menu works). With the Mega Menu, clicking on a parent (top-level) menu item pops open a larger menu display, with a photo, description, and the child (sub-menu) items.
How to Use the Mega Menu
Navigate to your Site Builder Dashboard (admin/dashboard). Under "Administer Menus," select "Manage Links".
At the bottom, check the box that says "Make into a mega menu", then click "Save".
Next, you will need to enable the mega menu option for the top-level menu item, add a photo, and add a description for this menu section.
Navigate to the Site Builder dashboard again, and select "Manage Links" again. Click edit next to the top-level menu item.
At the bottom, check the box for "make this into a mega menu," which will expand some additional options. After checking the box and expanding the options, click "Browse" to either upload a new photo or choose an existing one (such as a stock photo), add a description to accompany the mega menu, then click "Save".
Now, when you click on the top-level menu item, the mega menu will pop open.
The "Overview" Page
In the traditional "simple drop-down" menu option, visitors could click the top-level item to get to that page. With a mega menu, clicking the top-level item opens the mega menu, so we need another link (which is called "Overview") to take visitors to the top-level content for that menu item.
From a general user interaction perspective, site visitors generally expect to be able to get to some sort of top-level page before moving down to other sub-level pages. In this case, since the mega menu needs to open first (after the action of clicking with the mouse or tabbing with the keyboard), the "Overview" page serves as that top-level page. This is modeled after the menu structure on the Berkeley.edu gateway site.