media 65
Home | Login | Register | Order Products | Password Reset |

Media 65 Technologies
User Name:  Password:

Password Reset
Close

HomeJoomla! Joomla Template Kits Tutorials › Joomla Template Kit 3.X Manual




Joomla Template Kit 3.X Manual

Menu Module Parameters

 

We are looking at the default Main Menu module for Joomla.
Now you can have any number of menu modules but they all have the same parameters settings available
from the default core version. I will go over each one.

example: "User menu" or "Main Menu" both have the same parameters available if view them
in the module manager.




Menu Name:
Lets you choose the menu container that a module will display.
By default is the menu container that created it in the first place but can be changed.
 
Menu Style:
Joomla 1.5.X has a new and very improved menu system.
The menu style output setting core menu system in 4 ways.
Please note: Each setting has a different HTML output.
   
Menu Style> List:
This is a Unordered list HTML element. The menu works well with Javascript to make almost any type of menu it's
very flexible. The default menu uses a ".menu" CSS class more on this later in the Menu CSS page.

Example HTML output of a list menu style parameter

   
Unordered List "UL" tag can have a few settings it can have a custom ID added via the modules
Advanced Parameters > Menu Tag ID: to add more control to the menu for not only CSS but the Javascript to change how
the menu is displayed and example code output.
This can be used for a custom menu with CSS or Javascript or both.

The active inside a LI tag live link has an "ID=current" and CSS class of active* this can be used to highlight the
current selected menu item in the menu.

Joomla's Menu system also supports sub menus or what's called nested menus.
This basically puts an Unordered list inside an Unordered list LI tag to control the parent's order.
It can then be used by Javascript to make a menu with a sub menus etc.

Menu Style> Vertical Legacy:
This menu is a Joomla 1.0.X menu that works with Joomla 1.0.x templates styles in
legacy mode if needed. Outputs an HTML table with a row for each link that uses ".mainlevel" CSS class
on all href links also uses a element ID of "active" for the current active link location.
It also supports nested sub menus see Menu CSS.
This works with Legacy Parameters settings.

Example HTML output of a Vertical Legacy menu style parameter



Menu Style> Horizontal Legacy:
This menu is a Joomla 1.0.X menu that works with Joomla 1.0.x templates styles in
legacy mode if needed. Outputs an HTML table with one row that uses ".mainlevel" CSS class
on all href links also uses a element ID of "active" for the current active link location.
It does not support nested sub menus.

The reason that its called a horizontal menu its because if you look at the only TD tag it has a "nowrap=nowrap" parameter set which
makes anything in the inside the TD tags align horizontally.

This works best with Legacy Parameters > Spacer: & End Spacer: settings.

Example HTML output of a Horizontal Legacy menu style parameter




Menu Style> Flat List Legacy:
This is a Unordered list HTML element. It does not support nested sub menus.
It uses ID "mainlevel" in the UL tag.

Example HTML output of a Flat List Legacy menu style parameter


For formatting and control of theses menus see the Menu CSS Page.

Moving on to the next set of settings

Both settings work with wants called nested menus sub of sub menu etc. a zero setting is not limited.
Start Level: 0
This setting to start the menu depth.
End Level: 0
This setting to stop the menu depth.


Always show sub-menu Items: the default is no.
This setting expands all the menus with sub menus by default
Menu
        | Sub menu
        | Sub menu
Menu 2

Target Position:
Opens Popup window set via javascript values for window properties
top=50,left=50,width=200,height=300


End of Module Parameter.

Start of the Module Advanced Parameters


Show White space:
To show white space with XHTML type doc.

Caching:
To cache module content with system cache.

Menu Tag ID:
Unordered List tag can have a few settings can have an ID added via the Advanced Parameters > Menu Tag ID section to add an .
This can be used for custom menu with CSS of Javascript or both.

Menu Class Suffix:
These work just like Module Suffix but there more code to cover.
Please see Menu CSS and Menu CSS Suffix

Module Class Suffix:
Module menus have chrome wrappers just like any other module.
See Joomla Template Code > CSS from more on Wrappers.

Maximum Menu Depth:
How deep you like the menu to go.

End of the Module Advanced Parameters

Start of the Module Legacy Parameters


Show Menu Icons:
Show the menu icons that you have selected for your menus.

Menu Icon Alignment:
Select Left or Right to set whether the Menu Icon is located to the left or right of the Menu Item name in the Menu display.

Expand Menu:
Select No or Yes to set whether any Child level Menu Items are permanently displayed in the Menu or not,
rather than only being available when the Parent Item is clicked upon.

Activate Parent:
Select No or Yes  to set the activation ID for all Parent Menus in the tree.

Full Active Highlighting:
Enable full active Menu Item highlighting, including for Link -
Component Item and Link - URL, which can cause the loss of XHTML compliance for the site, if more than one item is active.

Indent Image : Template | Joomla default images | Use parameters below | none
These image settings are for legacy template settings you can put menu indent images per level.
in your template images folder with Joomla 1.0.X templates. Use the ones in the Joomla install root imagesM_image.
Each one is a list of the images in the imagesM_images

  • Indent Image 1    
  • Indent Image 2    
  • Indent Image 3    
  • Indent Image 4    
  • Indent Image 5
  • Indent Image 6


Both these settings are used for horizontal legacy menu settings.
You can add characters in from and back of links example: | home | services | other | .
Spacer:
End Spacer:


This covers the menu module parameters settings.
Next we are moving on the Menu CSS styles.

 

^Top