Working with fireworks and dreamweaver – Adobe Dreamweaver CC 2014 v.13 User Manual
Page 709
Working with Fireworks and Dreamweaver
Insert a Fireworks image
Edit a Fireworks image or table from Dreamweaver
Optimize a Fireworks image from Dreamweaver
Use Fireworks to modify Dreamweaver image placeholders
About Fireworks pop-up menus
Edit Fireworks pop-up menus in Dreamweaver
Edit a pop-up menu created in Fireworks MX 2004 or earlier
Specify launch-and-edit preferences for Fireworks source files
Insert Fireworks HTML code in a Dreamweaver document
Paste Fireworks HTML code into Dreamweaver
Update Fireworks HTML code placed in Dreamweaver
Create a web photo album
Insert a Fireworks image
Dreamweaver and Fireworks recognize and share many of the same file-editing procedures, including changes to links, image maps, table slices,
and more. Together, the two applications provide a streamlined workflow for editing, optimizing, and placing web graphics files in HTML pages.
You can place a Fireworks exported graphic directly in a Dreamweaver document using the Insert Image command, or you can create a new
Fireworks graphic from a Dreamweaver image placeholder.
1. In the Dreamweaver document, place the insertion point where you want the image to appear, then do one of the following:
Select Insert > Image.
In the Common category of the Insert panel, click the Image button or drag it to the document.
2. Navigate to the desired Fireworks exported file, and click OK (Windows) or Open (Macintosh).
Note: If the Fireworks file is not in the current Dreamweaver site, a message appears asking whether you want to copy the file to the root
folder. Click Yes.
Edit a Fireworks image or table from Dreamweaver
When you open and edit an image or an image slice that is part of a Fireworks table, Dreamweaver starts Fireworks, which opens the PNG file
from which the image or table was exported.
Note: This assumes that Fireworks is set as the primary external image editor for PNG files. Fireworks is often also set as the default editor for
JPEG and GIF files, although you may wish to set Photoshop as the default editor for these file types.
When the image is part of a Fireworks table, you can open the entire Fireworks table for edits, as long as the comment exists in the
HTML code. If the source PNG file was exported from Fireworks to a Dreamweaver site using the Dreamweaver Style HTML And Images setting,
the Fireworks table comment is automatically inserted in the HTML code.
1. In Dreamweaver, open the Property inspector (Window > Properties) if it isn’t already open.
2. Click the image or image slice to select it.
When you select an image that was exported from Fireworks, the Property inspector identifies the selection as a Fireworks image or table
and displays the name of the PNG source file.
3. To start Fireworks for editing, do one of the following:
In the Property inspector, click Edit.
Hold down Control (Windows) or Command (Macintosh) and double-click the selected image.
Right-click (Windows) or Control-click (Macintosh) the selected image and select Edit With Fireworks from the context menu.
Note: If Fireworks cannot locate the source file, you are prompted to locate the PNG source file. When you work with the Fireworks
source file, changes are saved to both the source file and the exported file; otherwise, only the exported file is updated.
4. In Fireworks, edit the source PNG file and click Done.
Fireworks saves the changes in the PNG file, exports the updated image (or HTML and images), and returns focus to Dreamweaver. In
Dreamweaver, the updated image or table appears.
For a tutorial about Dreamweaver and Fireworks integration, see
.
702