ssdesign

Hi,
After looking at some threads on people discussing how to get an Image to display in front of Main Menu links, I decided to look into it.

I figured out this small hack and it works perfectly.

note: Does not work with solarFlare template (maybe someone can help me here.)

To display an Image in front of Menu Links follow these steps:

Step-1:
Upload the images you want to display for each menu item in the default "stories" folder.

You can do this by going to "Site > Media Manager" and upload the images in the root. (not inside any folder).

Step-2:

1. Go to "Menu > Main Menu" (or any other menu if yo have).
2. Select the Menu item to which you add an image by clicking it.
3. Go to "Parameters Tab".
4. From the first item called "Menu Image" drpdown, select the image you uploaded for the menu.
5. Save.

Step-3:
We need to make sure that the Main Menu "Module" is configured to show icon images. This is the cause of many people complaining that inspite of setting right parameters, the images are not showing up.

1. Modules > Site Modules
2. Select "Main Menu".
3. Click the "Parameters Tab" on the right hand side of your screen.
4. Look out for "Show Menu Icons" and click the "YES" radio button.
5. Also check the appropriate radio button for "Menu Icon Alignment" to display the icon on either left or right of the menu text.
6. Save.

Step-4:
So far what we have done will work fine and will display an Image that you specified in the Main Menu.

The problem is, this image does not get a hyperlink.

So for those of you who want to link this image, here is a small hack.

1. Go to the "Modules" folder in your installation.
2. Open the file "mod_mainmenu.php" in your text editor. I prefer Scite|Flash .
3. Go to line 85 which starts with
   PHP Code:

   $txt = '<a href="'. $mitem->link .'" class="'. $menuclass .'" '. $id .'>'. $mitem->name .'</a>';
            break;
        }

        if ( $params->get( 'menu_images' ) ) {
            $menu_params = new stdClass();
            $menu_params =& new mosParameters( $mitem->params );
            $menu_image = $menu_params->def( 'menu_image', -1 );
            if ( ( $menu_image <> '-1' ) && $menu_image ) {
                $image = '<img src="'. $mosConfig_live_site .'/images/stories/'. $menu_image .'" border="0" alt="'. $mitem->name .'"/>';
                if ( $params->get( 'menu_images_align' ) ) {
                    $txt = $txt .' '. $image;
                } else {
                    $txt = $image .' '. $txt;
                }
            }
        } 

4. Replace the entire code above with this:
   
   PHP Code:

   $txt = '<a href="'. $mitem->link .'" class="'. $menuclass .'" '. $id .'>';

//-------------------------------------------------------------------------------------
//Main Menu Image Hack by Sajid Saiyed of //http://www.ssdesigninteractive.com/g2
//-------------------------------------------------------------------------------------
            if ( $params->get( 'menu_images' ) ) {
            $menu_params = new stdClass();
            $menu_params =& new mosParameters( $mitem->params );
            $menu_image = $menu_params->def( 'menu_image', -1 );
            if ( ( $menu_image <> '-1' ) && $menu_image ) {
                $image = '<img src="'. $mosConfig_live_site .'/images/stories/'. $menu_image .'" border="0" alt="'. $mitem->name .'"/>';
                if ( $params->get( 'menu_images_align' ) ) {
                    $txt.= $image;
                } else {
                    $txt .= $image .' '. $txt;
                }
            }
        }
            
//-------------------------------------------------------------------------------------
//Main Menu Image Hack end
//-------------------------------------------------------------------------------------
            $txt.= $mitem->name;
            $txt.='</a>';
            break;
        } 

5. Save.
   

Step-5:
Now you can open your site to see that the Menu Icon has been linked.
I still have to figure out how to use ONLY IMAGE as menu links.

I tried setting BLANK name for Menu Item name but Mambo does not allow to keep the name as blank.

So if someone can help out here, it would be great.

Cheers and hope it works for you.

__________________
::form follows function::
my portfolio | {G2}-Generative Graphics