Part 9. How to add Mega Drop-Down Menu

This is tutorial on how to add and customize Mega Drop-Down Menu solution from Quintagroup for the Wink Responsive Theme on a Plone 4.3 website.

Fully responsive Mega Menu can be added to Wink responsive theme. If you got tired of simple navigation tabs, there is opportunity to add mega menu with any content instead. Mega menu uses panels located in portal top of corresponding folders that are displayed after clicking on the appropriate navigation tab.

To use mega menu with Wink responsive theme follow simple steps:

1. First you need to install quintagroup.megamenu and collective.panels packages (read installation instructions) and activate them via Site Setup -> Add-ons.

quintagroup.megamenu for Wink theme

2. Go to the first-level folder (News, Events, etc.) you want mega menu to be displayed for. Add /@@manage-panels to the folder address or click on the “Manage panels” link in the page footer.

3. Open new panel with “Add panel”. There in “Location” drop-down menu choose “Portal top” and select suitable layout.

add panels for megamenu

4. Click “Manage panel” in the portal top and start adding portlets from the drop-down menu.

Help your visitors to navigate the website. Shorten the path to useful information.

You can add any of the portlets available in Plone to make your website more animated: custom navigation links in static text portlet, images, RSS feeds or collections with recent updates, calendar with forthcoming events, relevant news and links, etc.

quintagroup.megamenu for Wink theme

You can add more than one panel, but locate them always in Portal top. Panels will not be visible on the page, but can be edited after adding /@@manage-panels to URL. When you hover or click on the folder's navigation tab, it will display the content of the panel (similarly to the drop-down menu).

Remember that when you activate quintagroup.megamenu, drop-down menu for navigation tabs will not be displayed.

Add panels with portlets for all or most of the first-level folders visible in navigation tabs. If you want to display only contents of the folder, you can add Navigation portlet to the panel and it will have similar view as the drop-down menus with contents.

Here is your mega menu for Wink responsive theme.

quintagroup.megamenu for Wink theme

Connect with our experts Let's talk