A Mootools powered dropline menu, displaying 1st menu items in the header, and 2nd menu items in a horizontal bar underneath. This bar displays dynamically on hover, via javascript, and all subsequent children load in the sidebar.

Theme Configuration: Splicemenu

Go to Admin Dashboard → Appearance → Widgets → Gantry Menu Set Menu Theme to : Splice-Menu.

The get the Splice-Menu working you need to use two Gantry Menus to make it appear in two levels. Below is the mandatory configuration for both menu widgets which allows you to replicate demo behavior :

First Gantry Menu widget – first level :

• Widget Position : Header
• Menu Theme : Splice-Menu
• Limit Levels : Yes
• Start Level : 0
• End Level : 0
• Show All Children : Yes
• Menu Classes : Main Navigation
• Enable Pill : Yes
• Menu Suffix : Top

Second Gantry Menu widget – second level :

• Widget Position : Navigation
• Menu Theme : Splice-Menu
• Limit Levels : Yes
• Start Level : 0
• End Level : 1
• Show All Children : Yes
• Menu Classes : Main Navigation
• Enable Pill : Yes
• Menu Suffix : -

Menu Item Options: Subtext

Subtext Line is the option that allows you to insert additional text to the Menu Item Title. There is separate styling for this, making it useful for adding brief descriptions to menu items.

Fusion Menu is a menu theme of the RokNavMenu extension, the addon that drives all RocketTheme theme menus. It is primarily a javascript enhanced CSS dropdown menu, that combines standard suckerfish type functionality with animations, transitions and other advanced effects provided by Mootools.

Go to Admin Dashboard → Appearance → Widgets → Gantry Menu Set Menu Theme to : Fusion.

• Widget Position : Header
• Menu Theme : Fusion
• Limit Levels : No
• Show All Children : Yes
• Menu Classes : Main Navigation
• Enable Pill : Yes
• Menu Suffix : -

Adding Subtext

Subtext Line is the option that allows you to insert additional text to the Menu Item Title. There is separate styling for this, making it useful for adding brief descriptions to menu items.

Adding Menu Icons

Menu Image is the option that allows you to insert an inline icon / image to the Menu Item.

Menu Columns

Columns of Child Items allows you to determine how many columns the Fusion dropdowns are presented in. You can have anywhere between a single dropdown to a four column dropdown.

Item Distribution

Item Distribution allows you to control how the menu items are ordered in the dropdowns:

• Evenly: If there are 7 menu items in 3 columns, Fusion will allocate a 3,2,2 distribution – trying to equalize each dropdown.
• Order: If there are 7 menu items in 3 columns, Fusion will allocate a 3,3,1 distribution – maintaining the item ordering.

Drop-Down Width (px)

Drop-Down Width (px) determines the total width of the dropdown, regardless of how many columns are shown. This option is to be used in conjunction with Column Widths (px)

Column Widths (px)

Column Widths (px) determines the width of each Column. Separate each width by a comma. The final column’s width is determined automatically. This option is to be used in conjunction with Drop-Down Width (px)

Below are some example configurations:

• Drop-Down Width: 480px: 160,160. Fusion automatically calculates the final width as 160, so in practise, 160,160,160 is the actual distribution.
• Drop-Down Width: 600px: 160,160. Fusion automatically calculates the final width as 280, so in practise, 160,160,280 is the actual distribution.

What is Grouping?

Group Child Items changes the behaviour of child items in the dropdown menus, instead of creating a dropdown for the immediate sublevel, this option places them inline. See below for an illustrated example of the differences:

Configuration

Set Group Child Items to Yes to activate the mode. The sublevels well then appear below the parent menu item in a categorical type structure.

A static menu system that displays 1st level items in the main horizontal menu and further children in the Sidebar.

Template Configuration: Splitmenu

Go to Admin Dashboard → Appearance → Widgets → Gantry Menu Set Menu Theme to : Split-Menu.

The get the Splice-Menu working you need to use two Gantry Menus to make it appear in two levels. Below is the mandatory configuration for both menu widgets which allows you to replicate demo behavior :

First Gantry Menu widget – first level :

• Widget Position : Header
• Menu Theme : Split-Menu
• Limit Levels : Yes
• Start Level : 0
• End Level : 0
• Show All Children : No
• Menu Classes : Main Navigation
• Enable Pill : Yes
• Menu Suffix : Top

Second Gantry Menu widget – second level :

• Widget Position : Navigation
• Menu Theme : Split-Menu
• Limit Levels : Yes
• Start Level : 1
• End Level : 1
• Show All Children : No
• Menu Classes : Main Navigation
• Enable Pill : Yes
• Menu Suffix : -

Menu Item Parameters: Subtext

Subtext Line is the option that allows you to insert additional text to the Menu Item Title. There is separate styling for this, making it useful for adding brief descriptions to menu items.