Wednesday, February 22, 2012

Fusion Menu

A Mootools enhanced CSS dropdown menu, with multi-columns, icons, inline modules and more.

Fusion Menu

Split Menu

A static three level menu with 1st/2nd level items in the header area, and all others in the sidebar.

SplitMenu

No Menu

An option to disable the menu, allowing for normal module use of the navigation position.

No Menu

You are viewing Mr. DeWolf's profile. Please be warned that this information is factual in every way possible!

 

Mr. Chad J. DeWolf

 

"The integration of technology is essential if our students are to be prepared for the global community that awaits them. Meeting the standards in standardized testing is no longer an option...we must exceed them. Remember, it’s not about AYP, it’s about the KID."

 

The Reason Why I'm Here:

As educators, we have a moral obligation to ensure that our students reach their greatest potential. I believe this obligation has remained unchanged over the years. What has changed is the setting in which our students live and learn. The truth is that we are now a global community collaborating with people from different states, countries and continents. Preparing our students for the world we once lived in is not enough.  Ten years from now, the jobs our elementary school students will be competing for will be much different than our current positions.  Some of those jobs we haven't even imagined yet! This is why it is imperative that decisions made by educators result in the improvement of student learning to ensure positive growth. How?  The solution is simple.  We teach them the lessons that never change...challenge yourself, seek progress, embrace change.  The integration of technology is essential if our students are to be prepared for the global community that awaits them. Meeting the standards in standardized testing is no longer an option...we must exceed them. It’s not about AYP, it’s about the KID.

The Reason Why I'm Here:

  • BS Science of Education | Western Michigan University
  • MA Educational Leadership | Walden University
  • Gifted Teacher Endorsed
  • CCSD Technology Rep. for Prof. Development
  • CCSD Action Team Member
  • CCSD District Team Leader
  • SMART Board Trainer Certified
  • Intel "Master" Teacher
  • MCSD School Data Team Leader
  • MCSD Technology Instructor
  • Inline Modules
  • Inline Positions
  • Menu Item Subtext
  • Menu Item Icons

All Menu Items can be edited from Admin → Menu → Menu NameMenu Item.

Basic Fusion Parameters

  • Subtext is the option that allows you to insert additional text to the Menu Item Title. There is separate styling for this, making it useful for adding brief descriptions to menu items.
  • Menu Icon is the option that allows you to insert an inline icon / image to the Menu Item.

Advanced Fusion Parameters: Columns

Menu Columns

Columns of Child Items allows you to determine how many columns the Fusion dropdowns are presented in. You can have anywhere between a single dropdown to a four column dropdown.

Item Distribution

Item Distribution allows you to control how the menu items are ordered in the dropdowns:

  • Evenly: If there are 7 menu items in 3 columns, Fusion will allocate a 3,2,2 distribution - trying to equalize each dropdown.
  • Order: If there are 7 menu items in 3 columns, Fusion will allocate a 3,3,1 distribution - maintaining the item ordering.
  • Manually: Determine the exact distribution of items across all columns in the Manual Item Distribution field. For example, if there are 7 menu items in 3 columns, you can specify a 4,2,1 distribution.

NOTE: If your Columns of Child Items setting is configured to be 2 or more columns, you will need to manually set the column widths and distribution, as outlined below. The default is 180px which is too small for multiple columns.

Drop-Down Width (px)

Drop-Down Width (px) determines the total width of the dropdown, regardless of how many columns are shown. This option is to be used in conjunction with Column Widths (px)

Column Widths (px)

Column Widths (px) determines the width of each Column. Separate each width by a comma. The final column's width is determined automatically. This option is to be used in conjunction with Drop-Down Width (px)

Below are some example configurations:

  • Drop-Down Width: 480px: 160,160. Fusion automatically calculates the final width as 160, so in practise, 160,160,160 is the actual distribution.
  • Drop-Down Width: 600px: 160,160. Fusion automatically calculates the final width as 280, so in practise, 160,160,280 is the actual distribution.

Advanced Fusion Parameters: Groupings

What is Grouping?

Group Child Items changes the behaviour of child items in the dropdown menus, instead of creating a dropdown for the immediate sublevel, this option places them inline. See below for an illustrated example of the differences:

Configuration

NOTE: Grouping cannot be applied to root items, only child items.

Set Group Child Items to Yes to activate the mode. The sublevels well then appear below the parent menu item in a categorical type structure.

Advanced Fusion Parameters: Modules

Fusion is now capable of loading individual modules or entire module positions inside its dropdowns.

  • Inline Modules: Set Child Item Type to Modules to load all modules setup on your Joomla site in a list. Select the module you wish to display in the dropdown.
  • Inline Positions: Set Child Item Type to Modules Positions to load all module positions on your Joomla site in a list. Select the position you wish to display in the dropdown.

 

Splitmenu

image

A static menu system that displays 1st and 2nd level items in the main horizontal menu and further children in the Sidebar.

  • Subtext is the option that allows you to insert additional text to the Menu Item Title. There is separate styling for this, making it useful for adding brief descriptions to menu items.

Code Modification: Remove the Menu in the Title

Open /templates/rt_camber_j15/html/modules.php and change:

<?php echo $menu_title_item->name.' '.JText::_('Menu'); ?>

To

<?php echo $menu_title_item->name; ?>

 

How to create Child / Sublevel menu items

Go to Admin → Menu → A MenuA Menu Item → Select a Parent Item, and it will appear as a child of it.

Image Image

Installation Process

Download and install the Bundle file if Gantry is not installed, use the Standard Template file if Gantry is already present.

More Information

RocketLauncher - Demo Replica

Deploy a replica of the this month's demo with ease, using the readily available RocketLauncher package.

More Information