Tutorials, extensions, and source files for ActionScript, Flash, and other Adobe products.

 

Fireworks Images Export Fix

Versions: Fireworks 8, Fireworks CS3

Files:

Introduction

In Fireworks 8 and CS3, the behavior of exporting HTML and Images has changed. Unlike prior versions of Fireworks, Fireworks now exports all slices for all frames (assuming not exporting current frame only) regardless of any behaviors you might use on slices that target frames. Before, in Fireworks MX 2004 and below, Fireworks would export all the slices in the first frame and then selectively export slices for other frames only when behaviors on your slices referenced slices in those frames. As a result, now with when you export your document containing frame referencing behaviors as HTML and Images you get images exported for slices that are not used by the HTML created. Though this does not functionally change or break anything within the HTML generated, it does create redundant images that may take up unnecessary space on your hard drive and web server.

Solution

To correct this issue, I have created a new extension (an HTML style) for Fireworks that overrides the default image export behavior for Fireworks 8/CS3 and only exports the images necessary for your behaviors. Download and install the ImagesFixHTMLStyle.mxp extension using the Extension Manager and restart Fireworks.

Using the Fix

An HTML style is essentially a template that Fireworks uses defining an HTML and Images export. To use this style, you need to select it in your HTML Setup settings in Fireworks. To access the HTML Setup dialog, you can use the File menu (File > HTML Setup)

File Menu

or click on the options button in the export dialog.

expot options

In the General tab of the HTML Setup dialog, there is an HTML Style pull-down menu that allows you to select the HTML Style for the current document. By default, this is set to Dreamweaver HTML, but other options are available as well.

html setup

Use the pull-down menu to select Dreamweaver Images Fix HTML or Dreamweaver Images Fix XHTML depending on your style of export--this style is the new style added by the extension that fixes how Fireworks exports images. When finished, click OK to save the changes.

Note: Fireworks 8 Default Styles

As of Fireworks 8, all default styles are essentially the same so you would have no reason to use any of the other default styles outside of Dreamweaver unless using a custom style such as this one.

Note: Missing Dreamweaver Images Fix HTML Style

If you are missing the Dreamweaver Images Fix HTML Style, you may need to restart Fireworks before the style is recognized. If you still do not see the style after restarting Fireworks, try reinstalling the extension.

After you have selected the new HTML style, export your document as you would normally using HTML and Images. The resulting export should only create the images needed to fulfil the needs of your behaviors and not create any redundant files not used by the HTML created. You may need to change this setting for each document you will want to use it with. However, you will only need to set it once for those documents. You will not need to set the HTML Style each time you export.

This extension is still in the testing stages. If you experience any problems with the HTML style, contact me.