SAVE 30% OFF on New Purchases, Renewals - No Minimum!
0
Your Cart is currently empty!
Product update
Coupon
add
Coupon code invalid! Please re-enter!
AJAX loader
You are here: HomeJoomla ExtensionsExtension User-GuidesSJ Mega Menu Userguide

SJ Mega Menu Userguide

This guide is intended for SJ Mega Menu module.
When you buy the module the first time, you will have the latest version. After the first release, we will update this module regularly, then please check newer versions when informed here
To see userguide for previous version: Click Here

REQUIREMENTS

1. Joomla!, supported versions are listed on our sale page.

INSTALLATION

1. Prepare your module package (zip file; please UNZIP first if it is indicated in the file name; there will be a plugin and a module zip file that you need them all in next step)
2. Install supportive plugin first (extracted plg_ file):
  • In your Administrator page, go to Extensions -> Extension Manager
    In this page, click Choose File, select plugin package.
  • Then click Upload & Install

  • Please wait for plugin being installed, usually within several seconds
  • Now go to Extensions -> Plugin Manager, click Select Type box and choose "system"
  • Then Enable the plugin named "Extra Menu Params"
3. Install main module now (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
  • Now go to Extensions -> Module Manager, click Select Type box and choose the module you have installed
  • Then click the module listed below to configure it as SETTINGS part hereafter

SETTINGS

1. The parameters are divided up into the following areas:
  • Menu Options
  • Advanced Options
MENU OPTIONS
  • Select Menu - Allow you to select and use a menu created in Menu Manager, this menu will be used with Mega Menu, all items of it will have some Extra Params, see configuration below
  • 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
  • Event
    • Click: Collapse/Expand menu by click, used with all devices
    • Hover: Collapse/Expand menu by hover, for PC only
ADVANCED OPTIONS
  • Menu Tag ID - Set ID of the module, used for CSS or others
  • Menu Class Suffix - Allow you to choose another CSS class that suits your template
  • Alternative Layout - Allow you to choose custom alternative layout
  • Caching
    • Use Global: Turn on caching
    • No Caching: Turn off caching
  • Cache Times - The time to cache
2. The parameters when configuring an item of a menu chosen (called it YTC Menu, for instance):
This module with one sample menu layout is below:

  • Home: a sub-menu item of YTC Menu, showing with image and description
  • Menu List: an other item of YTC Menu, divided into 3 columns
  • Modules: a special item showing Login form module
When landing Menu Manager -> YTC Menu, each item will have an extra option panel. Below is how to configure these:

EXTRA MENU OPTIONS for one item
    Options for this item:
  • Description - Set description for this menu item, e.x. "just a menu"
  • Content Type - Set Mega type for this menu item
    • Default: show as default
    • Divider: show as a horizontal bar, to separate between menu item groups
    • Module: very powerful option, to show module(s) inside, used with "Module" option below
  • Module - Select module(s) to be shown, when above option = Module
  • Show Link - Show link(s) of module(s), used when module is Pinned (by using "Show as" option below)
  • Item ID - Set ID for this menu item, used for CSS or others
  • Item Class - Use this option to set width of this menu item, relatively to its parent level.
  • *Example: Set col6, its width will be 50% of its parent whose with is cols12 set by "Column Class" option (see "Column Class" below)
    *Note: If icon of this item available, add -ico24, -ico32 OR -ico48 to this as well, in which 24, 32 and 48 are dimensions of square icon used
  • Float Right - If Yes, this item will be align:right with other Level-1 items

    Options for dropdown box
    (which contains all sub-menu items when being clicked or hovered):
  • Fixed Width - Set width (px) of dropdown box of this item
  • Column Class - Set cols5, cols9 or cols12 by which this item will be divided into 5, 9 OR 12 columns from Fixed Width above, this option is used with "Item Class" option of this sub-menu items
  • *Example: Set cols9, its width will be divided into 9 equal columns. If you want one of its sub-menu items will be 33%-width of this, please set its "Item Class": col3
  • Show as - Allow to choose how sub-menu items will be shown: Dropdown/Flyout OR Pinned
    • Dropdown or Flyout: Dropdown box will be shown after being clicked or hovered, with direction as Fly option below
    • Pinned: Show sub-menu items as being embeded inside
  • Fly - Allow to set direction for collapsing/expanding dropdown box: Left or Right, relatively to its parent level.




Love all our templates?

Join our membership clubs starting at $49 only for access to all of our templates

Join Now
Magento Themes Magento Extensions Free Magento Extensions Prestashop Themes Prestashop Modules Magento 2 Themes