i. Main menu:
Project menu:
New: New a blank project.
New from examples: Open the "New from examples"
dialog, and select your favorite template from the examples
list.
Open: Open a pre-saved project
file.
Save: Save the current configuration to a project file, so
that you can open the current design at the later time with
the "Open" menu item. Please note, this is not to
save the image files or the html source code. To export image
files, please use the menu "Publish/Export images".
To export html source code, or insert the HTML code to a html
file, please use the menu "Publish/Export html Wizard".
Save as ... : Save the current
configuration to a project file.
Exit: Exit the application.
Template menu:
Add button theme: Add a new theme
to the button theme list.
Add button template: Add a new
button template.
Popup menu manager: Open the "Popup
Menu Manager" dialog, so that you can edit your own popup
submenu for your design.
Publish menu:
Show preview window: Display the
built-in preview window.
Perview in Internet Explorer:
Preview in external web browser. Please
note: when you preview a local file in Internet Explorer
on Windows XP Service Pack 2, the navigation bar, menu and
other active content may be blocked. To view the design correctly,
please click the Information Bar on the top of the browser
window and select "Allow blocked content". There
will not be such problem after you upload the design to the
web server.
Export images: Open the "Export
images" dialog, so that you can export the images in
GIF, BMP or JPG format.
Export html wizard: Open the "Export
html source wizard" dialog, so that you can export html
source code of the navigation bar to a html file or insert
the code to an existing html file.
Help menu:
Help topics: Open the online help
document.
How to: Open the online "FAQ"
document.
Examples: Open the online examples.
Contact Us: Open the online "contact"
page.
Home page: Open the home page
of the product.
About: Open "About"
dialog of the software.
ii. Main toolbar
Main toolbar
New: New a project, you can select
to new a blank project, or open the "New form examples"
dialog, and select your favorite template form the examples
lit.
Open: Open a pre-saved project
file.
Save: Save the current configuration
to a project file, so that you can open the current design
at the later time with the "Open" menu item. Please
note, this is not to save the image files or the html source
code. To export image files, please use the menu "Publish/Export
images". To export html source code, or insert the HTML
code to a html file, please use the menu "Publish/Export
html Wizard".
Popup menu: Open the "Popup
Menu Manager" dialog, so that you can edit your own popup
submenu for your design.
Preview: Perview the current design.
You can select to display the built-in preview window, or
preview in external web browser. Please
note: when you preview a local file in Internet Explorer
on Windows XP Service Pack 2, the navigation bar, menu and
other active content may be blocked. To view the design correctly,
please click the Information Bar on the top of the browser
window and select "Allow blocked content". There
will not be such problem after you upload the design to the
web server.
Export images: Open the "Export
images" dialog, so that you can export the images in
GIF, BMP or JPG format.
Export html wizard: Open the "Export
html source wizard" dialog, so that you can export html
source code of the navigation bar to a html file or insert
the code to an existing html file.
Help: Open the online help document.
Register Now: This button will
only be visible in the unregistered version. It will open
the "Register Now" dialog window, and you can input
your username and registration code to register the software.
Button settings toolbar
Add button: Add a button to the
end of the navigation bar. The template of the new button
will be same as the last button of the navigation bar.
Delete button: Delete selected
button. You can select a button by left clicking it. By hold
"Ctrl" or "Shift" key, you can select
multiple buttons simultaneously.
Move left/up: Move the selected
button to an upper position.
Move right/down: Move the selected
button to a lower position.
Button state list: Change the
number of states of the buttons.
1 state: The button is a simply
static image file.
2 state: The button will respond
to "mouse over" and "mouse leave" events,
and will have a "normal" state image file and
a "hot" image file.
3 state: The button will respond
to "mouse over", "mouse leave" and "mouse
click" events, and change the button appearance according.
It will have 3 image files: "normal", "hot"
and "pressed".
3 state toggle: The button will
have 3 states same as "3 state". But the button
will keep in "pressed" state with a "mouse
click".
Navigation bar orientation list:
Change the orientation of the navigation bar. It can be "Horizontal"
or "Vertical".
Background color: Change the background
color of the button image.
Size fit to largest: All buttons
will have the same size as the largest one.
Show preview window: Toggle the
display of the built-in preview window.
Refresh preview window: Refresh
the preview window.
iii. Working area
The working area will display the buttons in design. To change
the properties of the buttons, you must first select it.
You can select a button by left-clicking it. By hold "Ctrl"
or "Shift" button, you can select multi buttons at
the same time.
iv. Button options
To change the options of a button, you must first select it.
You can select a button by left clicking it. By hold "Ctrl"
or "Shift" key, you can select multiple buttons simultaneously.
You can change options of multiple buttons at the same time
by selecting multiple buttons.
Text: Text of button.
Vertical: Align the text to top,
middle, bottom of the button.
Horizontal: Align left side of
the text to left, center, right of the button.
Text offset: Adjust the position
of the text.
Autosize, Width, Height: Use AutoSize
to adjust the button size automatically so to accommodate
the width and height of the text. When AutoSize is false,
the button has a fixed size specified in "Width"
and "Height" properties.
Hint: In Internet Explorer, a
yellow hint box will display when the user moves the mouse
over the button image.
Invert color: This option will
invert color of the button image.
Red: A color is made up of three
kinds of colors: Red, Green and Blue. This option will change
the "Red" part of the button image file. For example,
set it to "Green" will change the "Red"
part of the button to the same value as "Green"
part.
Green: A color is made up of three
kinds of colors: Red, Green and Blue. This option will change
the "Green" part of the button image file. For example,
set it to "Blue" will change the "Green"
part of the button to the same value as "Blue" part.
Blue: A color is made up of three
kinds of colors: Red, Green and Blue. This option will change
the "Blue" part of the button image file. For example,
set it to "Red" will change the "Blue"
part of the button to the same value as "Red" part.
Normal state: Set the options
of the "normal" state.
Mouse over state: Set the options
of the "mouse over" state and "moose click"
state, that is, the "hot" state and "pressed"
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.
Shadow, Color, Depth: You can
add a shadow to the text. The shadow will have same charset
and style as the text. "Depth" is the distance between
the text and shadow.
Icon: Add an icon to the button.
The icon can be Gif, Ico, Bmp and Jpg format. The Gif and
Ico formats files can be drawn transparently.
Icon alignment: Align the icon
image file to the left, right, top, or bottom of the button.
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. Button link and popup submenu
Link to address: 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 button
(the page contains this button) , the relative link is
like:
linkpage.html
If the linked page is in a sub-directory of the button
page, the relative path is like
sub-directoryname/linkpage.htm
If the linked page is in an up-level directory of the
button 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.
Popup submenu: Select a pre-defined
popup submenu from the popup submenu drop-down list.
Please note: When designing the
popup submenu, you can toggle the built-in preview window
on, and preview the design instantly. You can click the "Preview"
button on the main toolbar to display the built-in preview
window.
Popup submenu manager: Open the
"Popup Menu Manager" dialog, so that you can edit
your own popup submenu for your design.
When to display menu: You can
select when to display the popup submenu: when user moves
mouse over the button, or when user clicks on the button.
Where to display menu: Define
the orientation and positron of the popup submenu.
Popup direction: For a horizontal
navigation bar, the popup submenu can be above or below the
navigation bar; for a vertical navigation bar, the popup submenu
an be left or right.
Position relative to button: For
a horizontal navigation bar, you can align the left side of
the popup submenu with the left side, center, or right side
of the button; For a vertical navigation bar, you can align
the top side of the popup submenu with the top side, middle,
or bottom side of the button;
X offset, Y offset: Adjust the
position of the popup submenu.
|
