MACROMEDIA FIREWORKS 2, Use Manual

Page: 110 / 156

Chapter 3 110
Working with Dreamweaver
Macromedia Dreamweaver is a powerful visual web
page authoring tool. Use Dreamweaver and Fireworks
together to streamline your web design process.
Fireworks images in Dreamweaver
The most common way to use Fireworks and
Dreamweaver is to create web graphics and HTML in
Fireworks and then include them on web pages created
with Dreamweaver. Fireworks supports CSS
(Cascading Style Sheet) layers and Dreamweaver
libraries on export. Use CSS layer information in an
HTML editor, such as Dreamweaver, to precisely
position and animate objects.
Use library items in Dreamweaver for content that
appears on many pages in your site and for content that
must be updated frequently. Library files must have an
“.LBI” extension and must be located in a folder named
Library at the site root.
To place Fireworks images on a web page using
Dreamweaver:
1
Export images from Fireworks to a web format.
Use GIF, JPEG, or PNG.
2
Copy or move Fireworks images into your
Dreamweaver project folder.
Although you can include a file from anywhere on
your hard drive, it is easier to find and upload the
files from Dreamweaver if you keep all your images
in the same place in your Dreamweaver project
folder.
3
Click the location in the Dreamweaver document
where you want to place an image, and then
choose Insert > Image.
4
In the Insert Image dialog box, choose an image
and click OK.
Be sure the path between the HTML document
and the image exactly matches the path used on
your web server.
The link to the image is formed and the image
appears on the Dreamweaver page much as it would
appear in most web browsers.
Note: Remember to upload the image to your web
server along with the Dreamweaver HTML document.
The image must be placed on the server in the same
place in relation to the HTML document as it was in
your project folder.
Editing Fireworks images that are placed in
Dreamweaver
Edit Fireworks images placed in Dreamweaver by
launching Fireworks from Dreamweaver and editing
the image. Edit GIFs and JPEGs in place in
Dreamweaver using a Fireworks source file or optimize
the image without affecting the source.
To launch and edit Fireworks graphics that are
placed in Dreamweaver 2:
1
In Dreamweaver, choose Edit > Preferences >
External Editor and set Fireworks as the Image
Editor.
2
In Dreamweaver, choose Window > Properties to
open the Properties inspector if necessary.
3
Select an image and click Edit on the Properties
inspector.
Dreamweaver launches Fireworks, if it is not
already running.
4
Dreamweaver displays the following message:
“Do you wish to use an existing Fireworks
document as the source of <name of the
graphic>?”
◆
If a Fireworks source PNG file exists, click Yes,
browse to the PNG source file and click OK.
◆
If no Fireworks source file exists or if you only
want to edit the bitmap image placed in
Dreamweaver, click No.
5
Edit the graphic in Fireworks.
6
Choose File > Update.
When Dreamweaver launches and edits a graphic
in Fireworks, Update replaces Save on the File
menu. Choosing Update exports the image using
the last Export Preview settings, replaces the GIF or
JPEG used by Dreamweaver, and saves the PNG
source file if a source file was selected.