5.4 Installing the RokNavMenu Expandable Menu

Traditional Menus are very difficult to adjust and provide limited space for sub-menu items. This is generally okay for very small websites with fewer than 20 pages. But modern websites can have more than 100 pages and include a variety of different kinds of pages such as articles, videos, slide shows, forums, blogs, petitions, polls and interactive newsletters. It is therefore important to consider the future of your website’s content. If you plan to eventually have a large interactive website, the time to install an expandable menu is at the very beginning.

Rocket Themes Fusion Mega Menu:

An example of a Multi-column Expandable Menu

The RokNavMenu is a free Joomla component which includes an expandable menu, called Fusion, which can expand out to up to four columns. This menu also has the ability to add sub-texts to menu items, add icons (small images) to menu items, group menu items, change column widths, and even load modules and module positions inside of drop downs. It is made by Rocket Themes and can be added to the Cloud Access Cloud Base 2 template (which is the most recent and configurable Rocket Themes 960 Grid template).

What is in a Name?

There has been confusion about the name of this menu. To clarify, the name of the maker is Rocket Themes. The name of the Component is RokNavMenu. This component includes two different menus which are defined in the Template Editor. One of these two menu options is called the Fusion Menu.The Fusion menu is a type of menu called a Mega Menu, also called a Maxi—menu or an expandable menu. In this article, we will generally refer to this Menu as the Fusion Menu.

Rocket Themes has a very cool Demo page showing what can be done with the Fusion Menu.

http://demo.rockettheme.com/aug10/tutorials/fusion-menu

They also have a forum where you can learn solutions and tips for expanding the capabilities of your fusion menu. http://www.rockettheme.com/forum/index.php?f=208&rb_v=viewforum

Downloading and Installing the Fusion Menu

To download the RokNavMenu to your home computer, go to

http://www.rockettheme.com/extensions-joomla/roknavmenu

There are different versions for Joomla 1.5 and Joomla 1.7. Click on Download to put the program on your home computer.

Then log into the Administrator Control Panel of your Joomla website and go to Extensions, Install to upload the program to your website:

Go to the Plug In Manager and verify that the two plug ins are enabled:

Why you should not enable the RokNavMenu Module

Generally, one should enable Modules after they are installed and configure them using the Joomla Module Manager. But that is NOT the case with this module (which is actually part of a very complex component). If you enable the module, either it may not work at all. Or you could wind up with TWO menus being displayed. So, in the Module Manager, check to make sure that the RokNavMenu Module is NOT enabled.  

Configuring the RokNavMenu with the Template Editor

The configuration of the RokNavMenu is done primarily in two places. The Template – EDIT screen and the Main Menu Item – Edit Screen. Let’s first go to the Template Manager and click on EDIT to open the Template – Edit Screen:

Choosing the Fusion Menu Type

There are two menu types – the Fusion Menu and the Split Menu. Fusion is the one which is most customizable and expandable. It also adds the ability to add icons or small images to your menu items.  We will therefore use the Fusion Menu rather than the Split Menu. You can also turn both of these menus off if you simply want to use the menu which comes with the template.

Changing the Centered Drop-Down to YES

The default drop down is to have the menu items drop below and to the right of the main menu items. However, this creates a problem for two and three column sub-menu drop downs because they may go completely off of the right side of the page – and not display at all. Therefore, change Center Drop Downs to ON. This will change the drop so it is centered to the left and right of and below the main menu item - reducing the chances of the sub-menu going off the page. Then click APPLY, then Preview, then SAVE.

The rest of the configuration is done using the Menu Item Manager. That is the topic of the next article.