SJ Mega Menu

This guide will help you install SJ Mega Menu step by step.

 

1REQUIREMENT – Back to top

At the basic level, this module will require the following conditions:

  • Compatible with version Joomla: Joomla! 3.x and Responsive layout.

2INSTALLATION – Back to top

Prepare your module package

  • Firstly, you need to UNZIP file that you have downloaded. Please note that you should choose module package that are suitable with each Joomla version which you have just downloaded.
  • Secondly, install main module (extracted mod_ file):
  • In your Administrator page, go to Extensions -> Extension Manager. In this page, click “Choose file”, select module package.
  • Then click Upload & Install

    • Please wait for module being installed, usually within several seconds.
  • Third, Enable 2 plugins: Extra Ajax For Menu (plugins/ajax) and Extra Params For Menu

 

  • Now go to Extensions -> Module Manager, click Select Type box and choose the module you have installed.
  • Prepare to perform Module Configuration

3MODULE CONFIGURATION – Back to top

3.1 Module Demo

3.2 Module Configuration

Note:We used the images of module’s installation on Joomla 3.x to illustrate.

After installing, go to Extensions -> Module Manager and find SJ Mega Menu to configure.SJ Mega Menu module is configured in 3 main groups of parameters as following:

  • Module.
  • SJ Mega Menu Options.
  • Advanced.

Let’s look at the parameters in detail:

Module. 

  • Layout – Allow you to choose LTR or RTL layout of this module
  • Show heading title – Allow you to show heading title
  • Heading title – Allow you to enter the heading title
  • Background menu – Allow you to choose Background menu
SJ Mega Menu Options. 

  • Select Menu – Allow you to select and use a menu created in Menu Manager.
  • Event
    • Click: Collapse/Expand menu by click, used with all devicesal
    • Hover: Collapse/Expand menu by hover, for PC only
  • Effect – Allow you to choose type of effect js.
  • Timeout effect – Allow you to speed up or slow down effects.
  • Use Css Style(no Js) – If you select No button, it means you use “effect js”. If your choice is yes button, “effect css” is occupied. If your choice is yes button, there is a list effect for css.
  • Select Menu Type – Allow you select the type of Mega Menu: Horizontal or Vertical.
  • Base Item – Allow you to select an active item for menu chosen above.
  • Start Level – Set a menu level from which will be rendered by Mega Menu, start from 1 as highest level.
  • End Level – Set a menu level until which will be rendered by Mega Menu, please use All for all sub-menu items.
  • Show Sub-menu Items – Show sub-menu items OR not, if NO then two options above will be ingored
  • Mobile Options – Select type of the menu displayed on the device
Advanced Options. 

    • Menu Tag ID – Set ID of the module, used for CSS.
    • Menu Class Suffix – Allow you to choose another CSS class that suits your template.
    • Alternative Layout – Allow you to choose custom alternative layout.
    • Post-texl – The content to show at the end of module.
    • Caching – Select whether to cache the content of this module.
    • Cache Time – The time in seconds before the module is recached.
    • Module Tag – Allow to select the HTML Tag for module.
    • Bootstrap Size – Allow to set the number of columns that module will use.
    • Header Tag – Allow to select the HTML Tag for module header/title.
    • Header Class – Support the CSS Class for module header/title.
    • Module Style – Select module style.

4Mega Menu Configuration – Back to top

 

To configure Mega Menu, please go to Menu => Main Menu => choose the menu you want (example: Home menu)

 

To get all the link of the menu items and sub-menu items from the original menu (example: “main menu” that you selected in “Select Menu” param of sj mega menu module). You should to open and save the each menu item level 1 again to initialized the params in the menu configuration.

If you add a menu item or change the order of menu items, the change does not appear in the SJ Mega Menu. you should to access the parent menu, click the reset button and save.

5SUPPORT – Back to top

Thank you so much for purchasing this extension. If you have any questions that are beyond the scope of this help file, please send us via: Submit a Ticket

Thanks so much!