i. Popup menu
manager
There are two ways to open the "Popup menu manager"
dialog. First, click button "Popup menu" on the main
toolbar. Second, in the "Button link & Popup submenu"
panel, click button "Popup menu manager".
The "Popup menu manager" dialog displays all existing
popup submenus. To add a popup submenu to a web button, you
must first define the popup submenu, then set this menu to the
web button via panel "Button Link & Popup submenu".
Existing popup menus list: This
list displays all defined popup submenu. The popup submenu
can be set to a web button via the panel "Button link
& Popup submenu".
Preview window: Preview the selected
popup submenu.
Refresh button: Refresh the preview
window.
New: New a popup submenu. You
can new a submenu from a pre-defined template, or you can
just new a blank submenu with the default options.
Edit: Edit the selected submenu.
Delete: Delete the selected submenu.
ii. Popup menu editor
You can edit the popup submenu with "Popup menu editor".
To add a popup submenu to a web button, you must first define
the popup submenu, then set this menu to the web button via
panel "Button Link & Popup submenu".
Menu Tree: The menu tree is composed
of menu items. The version 2.0 does not support nested submenus.
<Pop-up Menu>: The <Pop-up
Menu> is the root node of the menu tree. Clicking on this
node will show "Popup menu settings" panel, thus
allows configuration of the whole submenu's properties. Each
submenu has only one <Pop-up Menu>, you can not create
it or delete it.
Menu Item: Menu items make up
of a submenu. Clicking on a menu item will select it, and
display the "Menu item settings" panel, thus allows
configuration of this menu item. You can select multiple menu
items by hold "Ctrl" or "Shift" button.
You can add, delete, move a menu item with buttons "Add
menu item", "Delete menu item", "Move
up" and "Move down".
Add menu item: Add a menu item.
The new item will be inserted before the current selected
item. If no menu item is selected, the new item will appended
to the last item.
Delete menu item: Delete selected
item.
Move up: Move the selected item
to a upper position.
Move down: Move the selected item
to a lower position.
Save as template: Save the current
popup submenu as a template, then you can apply this template
to your later design.
Preview window: The preview window
enables you to view the design instantly.
Refresh: Refresh the preview window.
Menu name: You must set a name
for the designed popup submenu. Then you can set this submenu
to a web button via the panel "Button Link & Popup
Submenu".
Apply template: Open the "Popup
menu template" window, and apply your favorite submenu
template to the current design.
iii. Menu global settings
In the menu tree, clicking on the <Pop-up Menu> node
will show "Popup menu settings" panel, thus allows
configuration of the whole submenu's properties.
Autosize, Width, Height: Use AutoSize
to adjust the menu size automatically so to accommodate the
width and height of the text. When AutoSize is false, the
menu has a fixed size specified in "Width" and "Height"
properties. Please note, if the
size specified in the "Width" and "Height"
is less than the text size, the menu will autosized to the
text size.
Distance between each menu item:
The distance among each menu item. Specify a number of pixel
to set item's spacing.
Background: Set background color
and background image of the submenu.
Background Color: To set the background
color of the menu, please check the "Set color"
option, and click on the "Color" square to set the
color value.
Background Picture: To set a background
image to the menu, check the "Use background picture"
option, and click on the "Browse" button to select
a image file.
Seperate line color: You can set
a menu item as a seperate line in the menu's "Menu item
settings". This color option will define the color of
the seperate line.
Border: Set border size, color
and style of the menu border.
Size: border size in pixel.
Color: Click on the "Color"
square to set the border color.
Style: There are eight types of
border style. Select form the drop-down list to specify the
border style.
Set each side of the border differently:
Other than set the submenu's border as a whole, you can set
each side of the border seperately.
Left: Whether to display left
side of border. You can set the left side's properties in
the "Left" panel.
Top: Whether to display top side
of border. You can set the top side's properties in the "Top"
panel.
Right: Whether to display right
side of border. You can set the right side's properties in
the "Right" panel.
Bottom: Whether to display bottom
side of border. You can set the bottom side's properties in
the "Bottom" panel.
iv. Menu item settins
Clicking on a menu item in the Menu Tree will select this
menu item, and display the "Menu item settings" panel,
thus allows configuration of this menu item. You can select
multiple menu items by hold "Ctrl" or "Shift"
button.
Apply options to other menu items:
Clicking this button will apply options of the current selected
menu item to others items in the submenu.
Set as seperate line: Set this
menu item as a seperate line. The color of the seperate line
is defined in the "Seperate line color" property
on the "Popup menu settings". You can click on the
<Pop-up Menu> node to display the "Popup menu settins"
panel.
Text: Text of menu item.
Vertical: Align the text to top,
middle, bottom of the menu item.
Horizontal: Align left side of
the text to left, center, right of the menu item.
Space between content and boundary:
The space between the content of an item and its boundary.
Specify a number of pixel to set item padding.
Link to: Specify the URL link
address of the target page. You can use:
- Absolute web site link like:
http://www.mtopbutton.com/help/linkpage.html
- Relative link:
if the linked page is in the same directory as the navigation
bar (the page contains this navigation bar) , the relative
link is like:
linkpage.html
If the linked page is in a sub-directory of the menu
page, the relative path is like
sub-directoryname/linkpage.htm
If the linked page is in an up-level directory of the
menu page, the relative path is like
../linkpage.htm
Please note: If the file system
of the web server system is case sensitive, the link you
entered should be case sensitive, too. So please be careful
on using the capital and lowercase letter.
Target: Select a frame target
from the drop-down list or input your own frame's name to
open the link in your defined window or frame.
_blank: Load the linked page
into a new, unnamed browser window.
_self: Load the linked page
into the same frame or window as the link. This target is
the default, so you usually don’t need to specify
it.
_parent: Load the linked page
into the parent frameset or window of the frame that contains
the link. If the frame containing the link is not nested,
the linked file loads into the full browser window.
_top: Load the linked page
into the full browser window, thereby removing all frames.
User defined: If you want to
open the linked page in a specified frame, please input
the frame's name into the Target box.
Icon: Add an icon to the menu
item. The icon can be Gif, Ico, Bmp and Jpg format.
Icon alignment: Align the icon
image file to the left, right, top, or bottom of the menu
item.
Normal state: Set the options
of the "normal" state.
Mouse over state: Set the options
of the "mouse over" state.
Font: Set the charset set of the
text font.
Font color: Set the color of the
font.
Font style: You can set the font
to boldfaced, italicized and underlined.
Border: Set border size, color
and style of the menu border.
Border Size: border size in pixel.
Border Color: Click on the "Color"
square to set the border color.
Border Style: There are eight
types of border style. Select form the drop-down list to specify
the border style.
Background: Set background color
and background image of the menu item.
Background Color: To set the background
color of the menu item, please check the "Set color"
option, and click on the "Color" square to set the
color value.
Background Picture: To set a background
image to the menu item, check the "Use background picture"
option, and click on the "Browse" button to select
a image file.
Apply options to mouse over state:
Apply options of "normal" state to "mouse over"
state.
Apply options to normal state:
Apply options of "mouse over" state to "normal"
state.
v. Apply menu template
Save current menu as a template:
You can save current menu as a template, so you can use it
for your later design. To do this, please click "Save
as template" button, and save the current submenu as
a template.
Apply template to current design:
Click on the "Apply template" button, in the "Popup
menu template" window, select your favorite submenu template.
|
