1) Inserting Menu
Open Macromedia Dreamweaver, open document in which you want place menu. Choose: Insert => Media => Plastic Menu as it’s shown on the picture:
After choosing Plastic Menu you will see a dialog window where you have to define the folder and name to save .swf menu file. This file will be loaded during browsing your web page and this Flash file is responsible for Plastic Menu representing.
That’s all! In the design view of your web page you will see new Flash element:
2) Menu configuration
If you do not install “Softery Menus UI” extension before, please install it. The extension is included into delivery package or you can always download the latest version from http://www.softery.com/UI
To setup menu settings – right-click on the object view and choose Setup Softery Menu:
Configuration window will open with two areas: one for navigation tree editing and other to set parameters.
How to edit navigation tree
Now you can fast and quickly set your custom navigation tree using our Softery Menus UI component.
The menu already has some elements in the tree by default. You should set options according to your site design. You can build two-level menu for your site.
To add new menu element press “Add” button, you will see that new “New page” element will appear:
You can edit following settings for every menu element:
Name – the name of a web page.
You can use following HTML tags in Name field:
‹B›Home‹/B› - Bold
‹I›Home‹/I› - Italic
‹U›Home‹/U› - Underline
‹BR› - new line (Use this tag for multiline menu names)
URL – link on a web page.
It can be relative: ‘home.html’ or full address: http://www.mysite.com/home.html
Target – the way to open a web page.
Possible variants are: _blank, _parent, _self, _top or you can type your own target.
After changing information about menu element you should press “Save” button to save all changes.
To delete menu element choose the element and press “Delete”. If the element has sub elements, all sub elements will be also deleted.
You can change the level and place of chosen element by clicking on arrows in the “Change level” section:
The arrows appear automatically for every menu element according to allowed actions.
How to edit Menu Options
To set colors, fonts and sizes of menu elements open "Menu Options" tab:
Here you can change options of thirst and second levels of menu. The options are grouped according to menu level.
The list of possible options:
1) Menu Color – first level menu color.
2) Main Button Text Color – text color of first level menu button.
3) Main Highlight Color - the color of changeable elements in main menu when the mouse arrow is over
4) Main Font – font of first level menu button.
5) Main Font Size – font size of first level menu button.
6) Main Button Height – the height of first level menu button.
Choose it and the menu will automatically detect all other colors for its elements except those that you can change in Options view.
7) Sub Menu Color – sub menu main color.
8) Sub Button Text Color – sub menu buttons text color.
9) Sub Highlight Color - the color of changeable elements in sub menu when the mouse arrow is over
10) Sub Font - sub menu buttons font.
11) Sub Font Size - sub menu buttons font size.
12) Sub Button Height – sub menu buttons height.
Choose it and the sub menu will automatically detect all other colors for its elements except those that you can change in Options view.
To save changed options press "Save" button.
How to edit other Options
To edit other prossible options for this menu choose "Advanced Options" tab.
Here you can change options that will affect on the whole menu.
The list of possible options:
1) Background Color – the background color of the menu.
Change this color using color picker. You can get any color from Dreamweaver window.
2) Background Image – link to JPG or SWF image file for background.
Please, take into account that Baseline (“Standard”) JPG standard is supported. Keep the field empty if you do not want to use background picture.
3) Sub Show Speed – sub menu appearance speed.
The bigger the value is the faster the sub menu will appear.
4) Autosize – automatically menu stretch.
If you change sizes in the Dreamweaver document using standard tools the menu will automatically change the size according the changes if this option is checked.
5) Transparent Background – check this option to hide background image or color of the menu.
This effect will be visible only in the browser; Dreamweaver design view does not support it.
6) Auto Hide Sub Menu – on/off autohiding of sub menu
7) Selected Main Button – Number of preselected main button (type 0 for first button)
8) Need Search - check this field to make the search field available
9) Search Field Width - width size of search input field
10) Search Input Text Color - text color in search input field
11) Search Field Color - background color of search input field
To save changed options press "Save" button.
Working with Search field
You can check option Need Search to enable search form.
Special features of search form:
We do not provide any search engines with menu. Search form is united with the last first level button if search form is enabled.
Search form joins the last button in the menu. It works as other menu elements, but it also sends parameter “searchText” by method “POST”, which contains entered search text. For the correct work the link of the lastest element in the menu should have the URL of search engine that will receive parameter “searchText”.
|