How to Create a Navigation Menu in Fireworks - dummies

By David Karlins, Doug Sahlin

A navigation menu is nothing but a collection of buttons all lined up neatly horizontally or vertically. You can use Fireworks to create a navigation menu. You do all the grunt work in Fireworks and then add the menu to an HTML document you’re creating in Dreamweaver. Talk about your applications that play well with others!

To create a vertical navigation menu, follow these steps:

1Create a new document in Fireworks.

The document dimensions are the width and height of the area in which the menu appears in your HTML design.

2Create a single button.

Select the button with the Pointer tool.

3Hold down the Alt key (Windows) or Option key (Mac) and drag down.

This creates an instance of the button. After you start dragging, hold down the Shift key to constrain the motion vertically.

4Release the mouse button when the instance is aligned to the bottom of the previous button.

Objects in Fireworks have a magnetic attraction to each other. The button actually snaps to the bottom of the button above it.

5Repeat Steps 3 and 4 to flesh out your menu.

At this stage, you have a column of buttons with the same title. Not to worry; you’ll give each button its own identity in the following steps.

6Select the first button in your menu.

If the Properties Inspector isn’t already open, choose Window→Properties.

7In the Properties Inspector, enter the Link, alt, Target, Show Down State on Load parameters.

The target window in which the linked page appears. In most instances, _top is the proper choice. Your options are _blank, _parent, _self, and _top.

8Select the second button. If the Properties Inspector isn’t already open, choose Window→Properties.

You modify parameters for each button, but you perform one extra step for each button other than those on the home page.

9Type the title of the button in the Text field.

This changes the text that displays on the face of the button. Use the Properties Inspector to modify the other parameters of the button.

10Repeat Steps 8–9 for the remaining buttons.

You can design horizontal navigation menus in the same manner. Create a document that’s the height of your button. The width of the document is the button length multiplied by the number of buttons. After you create the first button, use Alt (Windows) or Option (Mac) to drag the button right while you hold down the Shift key to create an instance of the button.