Using Softery Menu
1) Inserting Menu
Open Adobe (Macromedia) Dreamweaver, open document in which you want place menu.
Choose: Insert => Media => G-Force Menu as it’s shown on the picture:
After choosing G-Force 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 G-Force 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 Softery Menu Setup:
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 quick set your custom navigation tree using our Softery Menus UI component.
By default menu already has some elements in the tree. You can tune it according your needs. 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 Text Highlight Color - the text color in main menu button when the mouse arrow is over
5) Main Font – font of first level menu button.
6) Main Font Size – font size of first level menu button.
7) Main Button Height – the height of first level menu button.
8) Main Text Align – the align of first level menu button text.
9) Main Text Bold – Main button caption text Bold (on/off)
10) Main Text Itallic – Main button caption text Itallic (on/off)
11) Main Text Underline – Main button caption text Underline (on/off)
1) Sub Menu Color – sub menu main color.
2) Sub Button Text Color – sub menu buttons text color.
3) Sub Highlight Color - the color of changeable elements in sub menu when the mouse arrow is over
4) Sub Text Highlight Color - the text color in sub menu button when the mouse arrow is over
5) Sub Font - sub menu buttons font.
6) Sub Font Size - sub menu buttons font size.
7) Sub Button Height – sub menu buttons height.
8) Sub Text Bold – Sub button caption text Bold (on/off)
9) Sub Text Itallic – Sub button caption text Itallic (on/off)
10)Sub Text Underline – Sub button caption text Underline (on/off)
Choose it and the 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) Need Search - check this field to make the search field available
7) Search Field Width - width size of search input field
8) Search Input Text Color - text color in search input field
9) Search Field Color - background color of search input field
10) Google Search - check this option to enable Google search (On search button user will be redirected on Google page)
11) Google Domain - URL of Google site, for example 'google.com' or 'google.co.uk'
12) Your Domain - provide you domain address to restrict Google search with your site
To save changed options press "Save" button.
Working with Search field
You can check option Need Search to enable search form.
1) Search Field Width - width size of search input field
2) Search Input Text Color - text color in search input field
3) Search Field Color - background color of search input field
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 you defined in Search Variable (“searchText” by default) 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 you defined in Search Variable (“searchText” by default).
Now you can easy setup menu search box to work with Google! Just use this parameters to configure Google search:
1) Google Search - check this option to enable Google Search
2) Google Domain - enter Google domain you want to integrate with search box (for example: http://www.google.com or http://www.google.co.uk)
3) Your Domain - enter your domain name (for example www.softery.com) to configure Google for search text only at your domain. Or keep it blank to configure Google for entire web search.
That is all! Easy Google search on your page integrated with Flash Navigation for less than 5 minutes!
To save changed options press "Save" button.
|