Extension:MegaMenu

The MegaMenu extension adds a jQuery MegaMenu to the top of Mediawiki. It includes several configurable parameters that make use of the jQuery library of effects such as hover, fade, slide and click.

Features
Comes with numerous features including the ability to include video, images or in its unmodified form upto 66 menu items per parent item (if you need more reduce the font size in ext.megamenu.css). Tabs are also available with very little customisation though this functionality will not be available in the beta version, but can potentially multiple the amount of links per drop down to almost 400 (I think 66 will suffice for now).

Limitations
At this stage in the developement process, using MegaMenu means changing the Vector skin quite a bit, though this is mostly achieved by making modifications to common.css, the remainder of the modifications are accomplished by the extension.

Compatibility
The initial test version worked on 1.22.2 and I have recently (8th April 2014) tested it on 1.22.5 with no problems.

The extension works with all major browsers apart from I.E 6 due to its lack of Javascript and CSS support.

= Installation =

Installation

Download the zipped folder and unpack in the extension directory.

Add the following to to LocalSettings.php

require_once("$IP/extensions/MegaMenu/MegaMenu.php");

Common.js edit

Navigate to MediaWiki:Common.js and add the following;

$(document).ready(function($){ 	$('.megamenu').megaMenuExt({ menu_speed_show : 300, menu_speed_hide : 200, menu_speed_delay : 200, menu_effect : 'open_close_slide', menu_easing : 'jswing', menu_click_outside : 1, }); });

Vector edit

Open Vector.php and find the following (around line 163);

Directly below this paste;



Find the following (around line 60);

$out->addModules( array( 'skins.vector.js', 'skins.vector.collapsibleNav' ) );

And directly above paste;

$out->addModuleScripts( 'ext.MegaMenu' );

Find the following (around line 73);

$out->addModuleStyles( $styles );

And directly below paste;

$out->addModuleStyles( 'ext.MegaMenu' );

Configuration Parameters
Change the links to suit your own needs by modifying extensions/MegaMenu/includes/MegaMenu.php

Version History

 * 0.0.1 Beta - (6/4/2014) A complete core hack!


 * 0.0.2 Beta - (8/4/2014) Creation of a basic extension that uses resourceloader to add the extension modules.


 * 0.0.3 Beta - (9/4/2014) Minimal hacking, needs testing before making stable.