User's Manual |
Image Menu
Short Description
An Image menu is designed to act in the same manner as a Standard, or Dropdown Menu. The difference being that you are able to specify individual images for each link on the main menu bar, replacing the text that would otherwise appear.
This type of menu is usefull when you require a more graphical impact than the standard text based menu, while still maintaining the dynamic functionality of the Aplinx system.
If you require different backgrounds for each menu button, an Image Menu allows you this luxury. As an example, see the image menu below, where all four links have differing backgrounds behind the text.
Please Note the following when using an Image Menu:
-
You cannot put images on sub menu items.
-
If you create additional menu items, you must upload and assign each page its own menu image (therfore keep the background file used to create the originals for later updates), otherwise the extra menu item will appear as plain text.
-
When creating an Image Menu with a rollover (hover your mouse over the first two menu links below for an example of this) you must create the rollover effect PRIOR to nominating the image for the page in Page Manager - If a rollover has been added to an image afterwards, to make it work, you will need to re-assign the image to the page as described below.
-
If you update the image, or Alt Text after the Image Menu's creation, like with the rollover, you will need to re-assign the image to the page before the change will appear on the menu.
See Also:
Below is an image menu (with links to other menu types in this manual). This page describes how such a menu was constructed.
|
|
|
|
|
How to
Setting the Menu type to Breadcrumb
To create an Image type menu you will need to select 'Javascript (Default)' when setting the initial menu options. See Menu for more information on creating a menu. You should then activate the ability to show Menu images with the Menu Images drop down.
The 'Root ID' field may be left blank (in the example menu above, the page "Menus" was selected to create a sub menu) - leaving this field blank will select the first page listed in your Page Manager (your home page, unless that page's menu status has been set to 'disabled'). See Menu/Creating a Menu for more information on the Root ID field.
If you have created a menu previously and wish to change it to an image type menu at a later stage, in the Menu Manager you will first need to select the radio button next to the ID number for that menu before clicking on 'Edit Type' from the Manager Options Menu. Click Save when the Menu Images option has been set to Yes.
Assigning an Image to pages in the menu
Creat the menu images for each page that will appear in the menu using your preferred a photo editing program, or, you may aquire these images from a graphic designer or another reputable source.
In this example, we have created four images, representing the four menu types. Import each of the respective images into the Image Manager first.
Please ensure you have included ALT TEXT for each of the images, as when a user is not able to view images the alt text will allow them to view your menu still. This feature is even more important if you have used a generic image without text. When alt text has been used, hovering your mouse over the image will reveal this text as a caption.
If you require an Image Rollover on each of the menu objects, add this NOW. If you have just added a rollover to an existing image menu object, you will need to repeat the following steps in order to activate the rollover effect. For more information on rollovers see Create an Image Rollover.
Next, go to the Page Manager. For each page that appears on the image menu, select to edit the page's properties.
Next to the MENU IMAGE text box, select the PICK button.
This will take you to the Image Manager. Locate the image for that page and click the corresponding PICK button (if you have an image rollover on the menu object, select the original image).
The ID number for that image will be placed into the Menu Image text box. Select SAVE to return to the Page Manager. Continue in the same manner for all other pages in the menu.
Setting Styles for Image Menus
Styles on image menus can be used to primarily govern spacing between menu buttons, borders and background colours/images around and behind the buttons. Please see the following items on Dropdown Menus for information on altering these styles:
| Overview | | | Managing Pages | | | Content and Applications | | | FAQs | | | Quick Tutorials | | | References | | | Contact Us |