Creating a multi-column mega menu with the Drupal Superfish module 

The Superfish module for Drupal 8 includes a multi-column option to create mega-menu style drop-down menus. Before installing the module be sure to download ver. 2.x of the Superfish library. Initially I had ver 1.x of the JS library and it didn’t have the styles for mega-menus.

‘.sf-multicolumn-column’ is one of the main mega-menu styles in superfish.css from ver. 2.x.

After installing the Superfish module I created a Superfish block in D8’s Block Layout area for my example site’s top-nav main-menu. In the Superfish main-menu block that I created I set the Start from depth to 1 and the to Levels to 2. See image.Superfish block settings

Here are some other articles about using the Superfish module for mega-menus:

Creating a mega menu (multi column) as shown in the demo – From 2011.

Superfish Mega Mensu – From 2/18/13.

Caveat: It was noted that if a parent menu item does not contain any children it will break the Superfish columns layout.

How to create Drupal multi-column sub-menus (Megamenus) with Superfish – From 2013.

The ZT megamenu module is a another option for creating multi-column menus an has an alpha version for Drupal 8. I haven’t had the chance to evaluate this module yet. More site seem to be using Superfish so that method might be more standard.

Jon G.