template.gif

1: Constructing your ImageBar
Load the file template.gif into a graphics program that supports the .gif format. Each of the Icons that you create must fit inside each square of the template. After you have created up to seven Icons and pasted them onto the template save the Image with an appropriate name, this will be the name you will use to reference the Image when setting up IconBar. Each individual Icon must not exceed 30x30 pixels in size.

2:Simple Setup To View IconBar on your page without any Links or Images the following HTML tages are required.

<applet
code=afIconBar.class
width=527
height=52 >

<param name=NoLinks value=7>
</applet>

The NoLinks is the number of Icons and Links that you wish IconBar to display. IconBar will not accept any more than seven. If you want more Icons and links than this simply set up another IconBar. In this simple setup NoLinks is set to 7. Remember No Icons will be visible at this time.

If you want IconBar to appear horizontally across your page the height parameter must be set to 52 and the width must be set to: width = (NoLinks x 75)+2

Horizontal Setup
height = 52
width = (NoLinks x 75)+2

If you want IconBar to appear vertically down your page the width parameter must be set to 77 and the height must be set to: height = (NoLinks x 50)+2

Vertical Setup
width = 77
height = (NoLinks x 50)+2

3: Adding the Icons to IconBar Use the IconImage parameter to reference the Image that contains your Icons. If this image is called MyIcons.gif then the following will work.

<applet
code=afIconBar.class
width=527
height=52 >

<param name=NoLinks value=7>
< param name=IconImage value="MyIcons.gif">
</applet>

At this stage IconBar should be displaying the Icons you have created.
Note: If this Image is located in another directory you must specify the full URL of its location.

4:Adding LinkName(n),Description(n) and Url(n) Parameters

LinkName(n)The name of the link that appears below each icon.
Description(n)The description of the link that appears in the web browser's status bar. This will appear when the mouse over a specific Icon . If you choose to leave Description(n) out of the IconBar parameters the Url of the link will show instead.
Url(n)The URL of the link, this can either be a full URL starting with "http://" or a name of a file within the same directory as IconBar.
(n) is the link number. Start with 1 then 2 .....
Example LinkName1, Description1, Url1

The following Horizontal setup has 5 Icons, 5 LinkNames, 5 Descriptions and 5 Urls

<applet
code=afIconBar.class
width=377
height=52 >

<param name=NoLinks value=5>
< param name=IconImage value="MyIcons.gif">

<param name=LinkName1 value="Home">
<param name=LinkName2 value="Applets">
<param name=LinkName3 value="Purchase">
<param name=LinkName4 value="Support">
<param name=LinkName5 value="Contact">


<param name=Description1 value="Silk Webware homepage">
<param name=Description2 value="Silk Webware Applets">
<param name=Description3 value="Purchase your full licensed versions ">
<param name=Description4 value="Customer help">
<param name=Description5 value="Company information and contacts">


<param name=Url1 value="display.html">
<param name=Url2 value="http://silk.webware.co.nz/Products">
<param name=Url3 value="http://silk.webware.co.nz/Order">
<param name=Url4 value="http://silk.webware.co.nz/Support">
<param name=Url5 value="http://silk.webware.co.nz/Contact">
</applet>

5: RegistrationID

Once you have purchased IconBar you will receive a RegistrationID, enter it in as a parameter; Note: Each RegistrationID is unique and is to be used in accordance with the Single site License IconBar will show Unregistered version when on the Internet if the incorrect RegistrationID is used

"if your RegistrationID is F-d8ca8765-I1 then the following will work"

<param name=RegistrationID value="F-d8ca8765-I1">

6:Optional Parameters Not required for simple setup.

a: Frame Once you press the selected Icon, IconBar will open the page in the current frame, default "_self". To change the frame where the page is opened use the Frame paramter. IconBar follows the standard HTML frames rules

"_self" ---show in the current frame <default>
"_parent" -----show in the parent frame
"_top" -----show in the top most frame
"_blank" ------show in a new unnamed top-level window
<other> -----show in top-level window named <other>

Example:
<param name=Frame value="_blank">
This will cause IconBar to open the selected page in a new unnamed top-level window.

b:LinkNameCenter If you wish the LinkName to appear on top of the Icon, set LinkNameCenter to true. By default LinkNameCenter is set to false
<param name=LinkNameCenter value=true>

c:BarFramed Setting BarFramed to true will give the effect of indenting IconBar into the page. This can be used in conjunction with HTML tables to meet your required effect. By default BarFramed is set to false
<param name=BarFramed value=true>

d:BackColor IconBars default color is LightGray, if you wish to change this you can by changing BackColor. BackColor accepts the "Hexidecimal Color format". If you change this color please ensure that the background color within the IconImage is also changed to compliment your new color.
<param name=BackColor value="909090"> This will change IconBars color to a darker gray
<param name=BackColor value="ffffff"> This will change IconBars color to white
<param name=BackColor value="ff0000"> This will change IconBars color to red

e:ClickSound If you want IconBar to sound when an Icon as been clicked use ClickSound. The format must be "Sun's AU format". If you do use this option try to keep the sound file small so loading time is kept minimal.
<param name=ClickSound value="chirp1.au">

f: AllUp If you want IconBars buttons to appear all the time, rather than only when the mouse is over an Icon, set AllUp to true. All up by default is set to false.
<param name= AllUp value=false>

g: LinkNameColor The color of the LinkNames that appear on IconBar are usually black, if you want to change this color, set LinkNameColor to the color of your choice. Note: LinkNameColor also uses the "Hexidecimal Color format".
<param name=LinkNameColor value="ff0000"> will color LinkName Red.

h: LinkNameBold If you wish LinkName to appear BOLD set this to true.
<param name=LinkNameBold value=false>

i: LinkNameFont To change the FONT face from Helvetica use LinkNameFont.
<param name=LinkNameFont value="Helvetica"> Default value
<param name=LinkNameFont value="Courier">
<param name=LinkNameFont value="TimesRoman">

j: LinkNameSink If you wish the LinkName to appear sunken into the IconBar set this to true. LinkNameSink by default is false.

Q1: Why canÆt I see IconBar on my page?
a: You may have made a mistake in the HTML tags used to embed the Control Pad on your page. Check both the Spelling and the Case.
b: Have you included the appropriate .class files in the same directory as the page containing the IconBar Control Pad? The following are both required.

afIconBar.class
afIcon2.class

If you want to use IconBar on many pages within your site you can add Codebase after "code=" This means you only have to keep the two files in one place.
code=afIconBar.class codebase=http://www.yoursite.com/DirectoryWithClassfiles/
c: Are you using a Java enabled browser? Find out how to get one. Most browsers released today are Java enabled.

Q2: Why wonÆt a IconBar linked page open?
a:Have you entered the correct URL in the Url(n) parameter
b:Does the page IconBar is trying to open (still) exist

Q3: Why are my Icons messed up?
a:Have you used the template.gif as your base to draw your Icons.
b:Dose the BackColor of IconBar match the back ground color of the Icons.

Q4: Why are there no IconImage images?
a: Check your Html parameters, spelling and case
b: The image you are referring to may be a .gif not a .jpg (vs/vs)

Q5: I have just changed the parameters of the IconBar Control Pad, but it appears the same as before.
a: You must reload the page in a new browser window, and completely clear the cache. Also try:
(tm)Netscape: press the shift key and the Reload button at the same time.
(tm)Internet Explorer: press the refresh button.