Accessibility
 
Home > Products > Dreamweaver > Support > Inserting Media
Dreamweaver Icon Macromedia Dreamweaver Support Center - Inserting Media
To create a button template:

1 Create a new file in Flash.
2 Choose Insert > New Symbol and select the Movie Clip behavior. Name the symbol and click OK.
This symbol will become the Up state of the button so you may want to name this symbol "up_state".
3 Design the graphics for the button's Up state within the movie clip symbol.
4 Chose Insert > New Symbol, and select the Movie Clip behavior. Name the symbol and click OK.
This new symbol represents the Over state of the button so you may want to name this symbol "over_state". You could also duplicate the up_state symbol and modify it to create the Over state of the button.
5 Design the graphics for the Over state of the button within the movie clip symbol.
Repeat steps 4 and 5 for the Down state movie clip symbol.
6 Choose Insert > New Symbol, and select the Button behavior. Name the button and click OK.
The Button symbol should have one layer and 4 frames (Up, Over, Down, and Hit).
7 Select the Up frame and drag the up_state movie clip symbol to the frame.
8 Choose Window > Panels > Info to open the Info panel. Select the up_state symbol, and note the X and Y coordinates. Use these coordinates for each movie clip symbol to ensure that they are in the same place.
Note: Set the X and Y coordinates to something easy to remember, like 0.

9 In the Button symbol, select the Over frame and choose Insert Keyframe.
The up_state symbol appears in the Over frame, so select and delete it.
10 From the Library panel, drag the over_state symbol to the Over frame. With this symbol selected, set the X and Y coordinates to those of the up_state symbol.
Repeat steps 9 and 10 for the Down state frame.
11 In the Hit frame of the button, right-click (Windows) or Control-click (Macintosh) and choose Insert Frame.
12 Choose Insert > New Symbol, and select the Movie Clip behavior. Name the symbol and click OK.
This new movie clip symbol becomes the Generator Text object for the button, so you may want to name this symbol "text".
Note: If you want the text to have a different color for each button state, you must create a separate symbol for each Generator Text object. In this case, you may want to name this first symbol "up_text".

To set the necessary parameters in the Generator Objects panel:

1 Select the text movie clip symbol on the Stage and choose Window > Generator Objects to open the Generator Objects panel.
2 Double-click the Generator Text object on the stage to launch the Generator panel. If it does not appear, choose Window > Panels > Generator. (Resize the panel to display all of the fields if necessary.)

3 Set the necessary parameters for the Generator Text object by entering the following variables in the Generator panel
Type {Button Text} in the Text field (required).
Specify the color of the text in the Color field (optional). Either type a color's hexadecimal value, like #000000, or type a color's name, like black.
Type {Button Font} in the Font field to specify the font you want to use in the Button object in Dreamweaver (required).
Type {Button Size} in the Font Size field to specify the button text font size in Dreamweaver (required).
Set the Bold and Italic fields to true if you want your text to have these effects (optional).
Set the Alignment field (required). Your choices are left, right, center, and justified.
Set the Vertical Alignment field (required). Your choices are top, bottom, and center.
Note: You can set the text color for each button state. To do this, duplicate the text symbol using the Library panel, and then change the color variable in the new symbol. Make sure the name of each new symbol makes sense to help you remember which state you are designing.

4 In the Library panel, double-click the button symbol to open it in symbol-editing mode.
5 In the Timeline of the button symbol, add a new layer by choosing Insert > Layer. In the new layer, drag the text symbol to the Up frame (or the up_text symbol if you are using more than one color version of text).
If you want more than one color version of text, insert keyframes in the appropriate states of the button Timeline and drag the text symbols to them.
6 On the Stage, right-click (Windows) or Control-click (Macintosh) the button symbol and choose Actions from the pop-up menu to open the Object Actions panel. You can also choose Window > Actions.
7 Click the Basic Actions icon to expand the category, and then double-click Get URL in the Toolbox list.
By default, the Get URL action is applied on (release), or when the user releases the mouse button.
8 In the bottom right corner of the Object Actions panel, click the triangle so that it is pointing up. (The pane that displays the parameters should be visible.) In the URL field, type {Button URL}; and in the Window field, type {Button Target}.
9 Drag the button symbol to the top left corner of the Stage and chooseModify > Movie. Select Contents for the Match setting and click OK.
Your button is now ready for export.
10 Choose File > Export Movie. Remember that you are exporting the movie as a SWT file, and the SWT file must be placed in the Dreamweaver 4/Configuration/Flash Objects/Flash Buttons folder in order for you to access it using the Insert Flash button command.
 
Previewing your button movie in Flash
You may want to test your button in Flash before exporting and using it in Dreamweaver. To do this, you must copy two updated Generator library files from Dreamweaver over to Flash—the flashgen.jar file, and the jflashgen file (jflashgen.dll in Windows). (This is because some changes have been made to these library files since the last version of Generator.)

Note: Backup the original files before you copy and update these library files. When you have finished working with button templates, restore the original files. We recommend this because there may be some compatibility issues with the new files, as they haven't been tested thoroughly.

Macintosh users:

Copy the jflashgen file from the Dreamweaver application folder to the Flash application folder.
Copy the flashgen.jar file from the Dreamweaver/Configuration/Generator/classes folder to the Flash/Generator/classes folder.

Windows users:

Copy the jflashgen.dll file from the Dreamweaver/Configuration/Generator/bin folder to the Generator/bin folder.
Copy the flashgen.jar file from the Dreamweaver/Configuration/Generator/classes folder to the Generator/classes folder.

To Table of Contents Back to Previous document Forward to next document