TheGrue Menu is a free responsive menu module for Joomla that allows you to create stunning, colorful menus on your website. This menu module has been tested on all major web browsers and mobile devices to make sure that your website will look professional to anyone who visit it. The module comes with lots of in-built features like custom color choice for menu background and links, 20 different font styles to choose from, option to have rounded or straight corners. Want a unique styled menu with extreme color combinations? TheGrue Menu module is what you are looking for.
To use this free module, you have to download it first and install it to your Joomla site. After installation go to Extensions > Module Manager, find the module TheGrue Menu and start setting it up.
The setup is very easy, here is a screenshot of the available parameters:
The module allows you to have multiple levels of menus with dorp-down animation and fully customize it for your design needs. You can change background and link colors for main and sub menus and also can choose from the most popular font styles from Google font directory.
By default the menu has rounded corners of 3 pixels, this can be increased or can set to 0 (zero) to deactivate.
Note: we tested this module with several templates, to make sure it works perfectly. However there are cases when the template styling overrides the module styling and could break the design of the module. To be sure that the module is not overlapping with any design element of your template, create a new module position, dedicated to this module.
TheGrue Menu Update
January 19, 2017
The GrueMenu has been updated again, fixing some minor jQuery conflicts again. Due to new Joomla version, on some websites the GrueMenu might be broken. Please update it with the new version. Thanks to everyone who pointed out in the comments bellow that there were some problems with the menu. Tested with various templates and latest Joomla 3.6.5 version, and everything seems to work just fine!
August 27, 2016
Minor changes to fix jQuery conflict when touchWipe is disabled. Thanks to Marcus and other users who reported this problem!
September 14, 2015
Have updated the module with a new feature: now you can set the maximum screen size for the mobile menu. The GrueMenu will switch to mobile once the screen size is equal or less then the set value.
August 22, 2015
As few user reported some bugs with the menu when using iOS and Android devices, I have implemented some minor changes to it to fix these bugs.
Also implemented the “touchwipe” library, so now the menu can be called on touching devices by sliding your finger from left to right. Sliding it in the off direction will hide the menu.
Fixed rendering of “Hamburger menu”, instead of making the small lines with borders, I changed that to 3 different span elements. As usual, if you find more bugs, please submit your observations bellow in the comments. Thanks!
July 30, 2015
I’m happy to announce that our responsive menu module has been updated, and comes with lots of great and new features that will make your job easier to add customized menu to your Joomla project.
The new version comes with a brand new responsive menu. As in the previous version the responsive menu was sliding down, the new mobile menu will slide in from the left when pressing the toggle button. I have also included the option to change the font size from module parameters, for both first level and sub-level menus; the Google fonts can now be included by typing in the name of the font style in the appropriate field in this format: Open+Sans+Condensed:300
Now it is possible to have multiple Grue menus on the same page, each having different font family, size, colors and layouts.
This is the usual drop-down menu style, with the horizontal layout. You can activate the fixed option to this menu, that will make the menu fixed to the screen while scrolling to the bottom of the page. This option can make the website navigation much easier if you have long content.
This layout can be used for footer areas, where you want your menu to be floating from bottom to the top.
Fly out menu
The fly-out menu layout, is straight forward, will show sub-menus on mouse hover fading in from left to right. It is ideal to publish this layout in the left sidebar of your template.
Slide from right to left – RTL Menu
This menu layout it may be ideal for website that requires RTL support.
I do recommend using the Fixed Menu option only with the drop-down layout, because the other layouts may not work just properly in fixed mode. If you are using multiple menus, I recommend enabling the Mobile Menu option only on one of them, probably for the main menu, just because the toggle buttons will overlap and menus will be unusable this way.
If you find any bug or have ideas how to improve this module, please leave a comment on this page.