1. Install MegaMenu module

To install Mega Menu module, is not much different to installing any other (free) Drupal modules, so you might be familiar with this process already. If not, please follow instructions below.

This video show you how to install MegaMenu module:

You can install by using Drupal module uploader or using FTP

Drupal module uploader

1. Download media and Ctools modules.
2. Log into your website
3. From admin toolbar, click Modules
4. Click Install new module
5. Browse to the media module file.
6. Click Install and wait while plugin is uploaded to your server
7. After successfully message, click "Enable newly added modules"
8. Click Install new module
9. Browse to the ctools module file.
10. Click Install and wait while plugin is uploaded to your server
11. After successfully message, click "Enable newly added modules"
12. Browse to the megamenu module's zip file and choose that file.
13. Click Install and wait while plugin is uploaded to your server
14. After successfully message, click "Enable newly added modules"
15. Find MD Megamenu and tick the checkbox (make sure it is checked)
16. Scroll to bottom and click Save configuration

You maybe ask to install dependent module, just click accept to install it

FTP

You can also install MD Megamenu via FTP

1. Download and extract media, Ctools module, you will get folder named "media" and "ctools" .
2. Browse to the Megamenu module's zip file and extract that file, you will get folder named "md_megamenu"
3. Open your FTP program and FTP into your site and navigate to the sites/all/modules/ directory
4. Upload md_megamenu and media folder to this directory
5. Back to your drupal admin toolbar, click Modules
6. Find MD Megamenu and tick the checkbox (make sure it is checked)
7. Scroll to bottom and click Save configuration

Update

When module has a bug fixes or enhancements, you will be notified to upgrade..

Installing updates is just involves replacing the old module files with the new ones. It's always a good idea to backup everything before you upgrade, especially if you have made any changes to Mega Menu's files, as the upgrade will overwrite all files. Menu that you created though Drupal admin will all remain intact.

Backing Up

1. It is always a good idea to back up your module before making any changes
2. Open your FTP program and FTP into your site and navigate to the sites/all/modules/ directory.
3. Download the md_megamenu folder and save it as a backup

Upgrading

1. Download the new version of the module from MegaDrupal.com
2. Browse to the module's zip file and extract that file, you will get folder named "md_megamenu"
3. Put your site to Maintenance mode (Go to "Configuration" then "Maintenance mode". Make sure the "Put site into maintenance mode" box is checked and click "Save configuration")
4. Switch to your FTP program, FTP into your site and navigate to the sites/all/modules/ directory.
5. Transfer the new md_megamenu folder into the sites/all/modules/ directory on your server, overwrite the existing one.
6. Clear site cache (Go to "Configuration" then "Performance" and click "Clear all caches" button)

Note: If you are running a local server, just copy and override the files.

2. Managing Mega menus

After installation, you can go to Structure » MD Mega Menu to see Mega Slider overview page.

Here you can manage all your mega menus, edit, clone, delete, import or export a menu.

Creating a new Mega menu

To create a new Mega menu, you can click "Add new MDMegamenu" link to start creating new menu.

Edit Mega menu

One Mega menu is split in two parts: Config and Edit. You can click to Configure to change menu config and click Edit to change menu items, layout...

Cloning an existing Mega menu

Cloning an existing Mega menu is easy, just click Clone link from slider overview page.

Delete a Mega menu

To delete a slider, you need to click Configure and scroll to bottom. Here you will find delete button, just click to delete your slider.

3.Menu Config

At the first screen, you will see simple forms that help you customize your Mega menu.

• General tabs:
  
  Config for horizontal or vertical menu, height, width, menu arrow...
• Animation tabs:
  
  In this tab, you can customize open dropdown effect, time delay before & after open.
• Design tabs:
  
  You can choose style, make some custom (background, color, hover state...)
• Text & Typography tabs:
  
  Custom font family (google webfont), font size, color... for various items of your mega menu

Click Save button, you will go to edit step.

4. Menu edit

This is where you create menu item, customize layout... for your mega menu. Here's a quick look:

4.1. Add new item

Item settings

After click "Add new menu item" you will see menu item settings. Here you can set enable megamenu for item, upload icon (if you're using icon with menu), change path, edit custom CSS, insert menu description

Working with layout:

You can create different layout for each menu item. Click layout tab and you will see:

You can choose grid 12 or 16 columns, insert custom width for dropdown item.

4.2. Assign item to menu item

After finish creating layout, you need assign some item to menu. Just drag and drop what you want into where you like to display. You can drag Drupal block or predefine items of mega menu module.

4.3 Flyout menu

You can create flyout menu too. First, go to menu item settings and uncheck "Enable megamenu for this item", save and you can add item for flyout menu.

5. Assign Mega menu to region

After creating mega menu, you need to assign it to some region. From admin toolbar, click Structure » Block, find "MD Megamenu: (your mega menu name)" and drag it to your desire region.

And now you can go to your website and enjoy your mega menu.

6. Customization

If you don't like predefine style, you can create a custom style for your mega menu (new CSS file).

First, you need to go to megamenu config > design tab and choose "Custom style" from "Predefined styles" list.

The following examples will explain the style suggestion names:

• default_theme/css/md-megamenu-{MACHINE_NAME}.css
• default_theme/css/md-megamenu.css
• sites/all/libraries/megadrupal/megamenu/md-megamenu-{MACHINE_NAME}.css
• sites/all/libraries/megadrupal/megamenu/md-megamenu.css

You can copy mm-style1.css, rename and custom it. Please remember to change .md-style1 classes to .md-custom (or just remove .md-style1 classes if you're using only 1 menu in your site)

7. Import/ Export

From overview page, click Export & Import tab, you will see:

Here you can select a menu for export or import mega menu from another site. You'll need to upload image, icon again because they do not go with export/import function