22.1 Dreamweaver Extensions


By definition, an infinite number of extensions are possible and we can't cover them all here. For those using extensions created by others, this chapter covers some of the most useful extensions. For those creating their own extensions, see Section 22.2 at the end of this chapter.

22.1.1 The Dreamweaver Exchange

You can search for, learn about, and download extensions using the Dreamweaver Exchange web site. If you develop your own extensions, you can upload them to the Exchange for others to use.

Using Dreamweaver extensions requires four steps:

  1. Pick an extension from the Dreamweaver Exchange.

  2. Download the extension to your local hard drive.

  3. Install the extension with the Extension Manager. (Installing an extension will update one or more parts of Dreamweaver's UI, such as the Objects panel, Insert Menu, Commands menu, Help menu, or the Add Behavior pop-up menu in the Behaviors panel.)

  4. Access the extension as you would access built-in features from the Objects panel, Commands menu, or elsewhere in the UI.

You can access the Dreamweaver Exchange in several ways:

  • Choose the Help figs/u2192.gif Dreamweaver Exchange option from Dreamweaver's main menu bar.

  • Choose the Commands figs/u2192.gif Get More Commands option from Dreamweaver's main menu bar.

  • Choose the Get More Behaviors option from the Add Behavior (+) pop-up menu in the Behaviors panel.

  • Choose File figs/u2192.gif Go To Macromedia Exchange from the Extension Manager's menu bar (or press Cmd-G on the Macintosh while the Extension Manager application is active).

  • Click the Go To Macromedia Exchange icon in the Extension Manager's toolbar (Windows only).

  • Click the Get More Styles button in the Insert Flash Button dialog box, accessible using Insert figs/u2192.gif Interactive Images figs/u2192.gif Flash Button.

  • Visit the Exchange directly by pointing your browser to http://www.macromedia.com/exchange/dreamweaver/.

Although no separate exchange exists for Fireworks extensions, there is a Fireworks category on the Dreamweaver Exchange. UltraDev and Flash extensions both have separate exchanges.

Visit the UltraDev Exchange at:

http://www.macromedia.com/exchange/ultradev/

Visit the Flash Exchange at:

http://www.macromedia.com/exchange/flash/

22.1.2 Picking an Extension

The Dreamweaver Exchange includes a description page and discussion forum for each extension. Extensions typically include documentation explaining their use. You can get additional help from the resources cited in the preface. Extensions are grouped into the categories listed in Table 22-1. You can find an extension by searching the Dreamweaver Exchange or browsing extensions by category. Many extensions are not in the category you might expect, so peruse them or use the Exchange's search option.

Table 22-1. Extension categories

Category

Description and sample extensions

Accessibility

Enhance accessibility for portable devices and users with disabilities , such as adding alt attributes to <img > tags, setting DOCTYPE elements, managing cookies, and assessing accessibility.

App Servers

Query, view, and format dynamic data accessed with ASP, JSP, ColdFusion, and PHP server-side languages.

Browsers

Scripts for browser detection and redirection, adding pages to favorites lists, and creating SMIL profiles.

DHTML/ Layers

DHTML objects and behaviors (including updated Show-Hide Layers and Set Text of Layers behaviors for NN6).

eCommerce

Transaction processing, shopping carts, and catalogs.

Fireworks

Fireworks integration with Dreamweaver; Firework image effects.

Flash Media

Flash object integration; additional Flash buttons or text styles.

Learning

Objects for learning and courseware, such as CourseBuilder (see Chapter 23).

Navigation

Additional styles of navigation bars, menu options, and frames effects.

Productivity

Authoring-time utilities that improve integration with other products, clean up HTML, and import site definition files.

Rich Media

Support for third-party multimedia plugins such as QuickTime, RealVideo, RealAudio, banner images, three-dimensional objects, and NetMeeting links.

Scripting

Tools to assist in writing Dreamweaver extensions and browser scripts in JavaScript, ASP, and PHP.

Security

Add security elements to your pages and prevent your site from being framed by another site.

Style/Format

Custom styles, custom formatting, and advanced CSS effects, such as floating frames, nonbreaking text, and CSS color changes.

Tables

Enhanced table creation, formatting, and manipulation, such as changing the table axis and populating a table with ODBC data.

Text

Advanced text editing and formatting features, such as spellcheckers, character case changes, math symbols, and text coloring.

22.1.3 Downloading an Extension

Instructions for downloading extensions are given on the Dreamweaver Exchange. You will be asked to register (for free) before downloading an extension. Most Dreamweaver extensions are free. Commercial extensions are identified on the extension explanation page and may offer a free lite version or 30-day trial.

Extensions, usually comprised of HTML and JavaScript ( .js ) files, are packaged in Macromedia Extension Package ( .mxp ) files, which include a compressed version of the extension plus documentation and related files. Downloaded .mxp files are installed in a separate step by using the Extension Manager . When downloading an Extension ( .mxp file), save it in a directory that is not within your site's root folder, thereby making it easier to delete the .mxp files when they are no longer needed. By convention, downloaded .mxp files are placed in a folder called DownloadedExtensions within the Dreamweaver 4 installation folder.

22.1.4 The Extension Manager

The ExtensionManager , shown in Figure 22-1 and formerly known as the Package Manager, is a standalone application that manages extensions.

There are several ways to launch the Extension Manager:

  • Choose the Help figs/u2192.gif Manage Extensions option from Dreamweaver's main menu bar.

  • Choose the Commands figs/u2192.gif Manage Extensions option from Dreamweaver's main menu bar.

  • In Windows, choose Programs figs/u2192.gif Macromedia Extension Manager figs/u2192.gif Macromedia Extension Manager from the Windows Start menu.

  • On the Macintosh, double-click the Extension Manager application in the Macromedia Extension Manager installation folder.

Figure 22-1. Extension Manager
figs/dwn_2201.gif

The Extension Manager is included with DW4, but DW3 and DW2 users must download the extension manager from Macromedia's site. Not all DW4 extensions work with prior versions of Dreamweaver and not all extensions support all browsers (the documentation for each extension includes compatibility information).

22.1.5 Installing an Extension

Download an extension from the Dreamweaver Exchange prior to installation. Install an Extension ( .mxp ) file that was downloaded previously by:

  • Choosing the File figs/u2192.gif Install Extension from the Extension Manager menu bar.

  • Pressing Ctrl+I (Windows) or Cmd+O (Macintosh) while the Extension Manager is the active application.

  • Clicking the Install New Extension icon in the Extension Manager's toolbar (Windows only).

  • On Windows, you can double-click an .mxp file to initiate installation (on the Macintosh, this works only if the .mxp file's hidden file type is set to MmXm ).

  • Extensions can be imported from other Dreamweaver or UltraDev installations by choosing File figs/u2192.gif Import Extensions from the Extension Manager menu bar (or by pressing Cmd-I on the Macintosh).

When prompted, select the .mxp file to install and answer any other questions that may be posed during installation (such as questions about a license agreement).

After installation, the Extension Manager tells you if you must restart Dreamweaver to access the new features provided by the extension. Some extensions can be reloaded by Ctrl-clicking (Windows) or Opt-clicking (Macintosh) the category selector in the Objects panel and choosing Reload Extensions.

Active extensions are indicated in the Installed Extensions list in the Extension Manager window by a checkmark in the On/Off field. When you select an extension, the Extension Manager displays brief instructions for the extension and explains how to access it in Dreamweaver.

22.1.6 Disabling Extensions

Disable an extension temporarily by unchecking the on/off checkbox next to its name in the Extension Manager window.

Excessive numbers of extensions can slow Dreamweaver's startup time. To reduce the application's startup time, disable extensions that you don't need.

Remove an extension to disable it permanently by:

  • Choosing File figs/u2192.gif Remove Extension from the Extension Manage menu bar.

  • Pressing Ctrl+R (Windows) or Cmd+- (Macintosh) while the Extension Manager is the active application.

  • Clicking the Remove Extension icon from the Extension Manager toolbar (Windows only).

22.1.7 Useful Extensions

The Dreamweaver Exchange contains over 480 extensions. Each extension has its own page containing a download link, a general description, a link to a discussion panel, reviews, compatibility information, and a link to ask questions of the extension developer. Most extensions are available for both the Macintosh and Windows. Some extensions enhance authoring-time capabilities, whereas others affect the visitors ' browsing experience.

Check the Dreamweaver Exchange periodically for new extensions, especially browser profiles used to support new versions of the major browsers. The Netscape 6 Pack update is part of the 4.01 update and can be downloaded from http://www.macromedia.com/support/dreamweaver/downloads/. Unzip (Windows) or unstuff (Macintosh) the downloadable Netscape 6 Pack to extract the .mxp file that can be installed as described earlier.

Ten useful extensions, a small fraction of those available, are listed next. These extensions must be downloaded from the Dreamweaver Exchange site and installed before they will be available on your installation of Dreamweaver. Each extension's category is indicated in parentheses following its name.

22.1.7.1 Add to Favorites (Browsers category)

The Add to Favorites extension, by Rvairi Conor McComb, opens the Add to Favorites dialog box when IE users visit a web page (visitors must respond to the dialog to complete the operation). This extension adds the IE figs/u2192.gif Add to Favorites behavior to the Add Behavior (+) pop-up menu of the Behaviors panel.

The Add To Favorites action is typically triggered by an onClick event associated with a hyperlink. When you apply the behavior during authoring, specify the title to be used for the entry in the favorites list.

22.1.7.2 Atomz Search (App Servers category)

The Atomz Search extension, by Atomz, Taylor, and Nadav Savio, lets you add an Atomz search engine to your web site, which allows visitors to search your site for keywords. You will need to create an Atomz account before using this extension.

Installing the Atomz extension adds an Atomz category to the Objects panel, as shown in Figure 22-2.

Figure 22-2. The Objects panel's Atomz category
figs/dwn_2202.gif

Add a search engine to your page by using the Insert Atomz.com Search button in the Objects panel's Atomz category or by selecting Insert figs/u2192.gif Atomz.com Search.

The Atomz Search extension requires a username and password that identifies your site (which is why you must first create an account with Atomz). Without the account information, the Atomz extension cannot insert the search engine. Once you've filled in the questions in the Atomz extension dialog box (not shown) Dreamweaver inserts the Atomz search field into your document, as shown in Figure 22-3.

Figure 22-3. Atomz standard and advanced search forms on a web page
figs/dwn_2203.gif

The HTML code inserted by the Atomz behavior for the standard search form is as follows :

 <!-- Atomz Search HTML for Wagonboss.net --> <form method="get" action="http://search.atomz.com/search/"> <input size=15 name="sp-q"><br> <input type=submit value="Search"> <input type=hidden name="sp-a" value="ab23456h89"> </form> 

Other utilities that add a search feature to your site include Simple Search from Matt's Script Archive (http://www.worldwidemart.com/scripts/search.shtml).

22.1.7.3 Banner Image Builder (Rich Media category)

The Banner Image Builder extension, by Rabi Sunder Raj, creates rotating banners ads with links. Once the extension is installed, use the Commands figs/u2192.gif Banner Image Builder option to open the Banner Image Builder dialog box, shown in Figure 22-4.

Figure 22-4. The Banner Image Builder dialog box
figs/dwn_2204.gif

In the Banner Image Builder dialog box, select the images and destination URLs, transition duration, and target frame. The code necessary to manage up to ten banner ad images is inserted into your document automatically.

22.1.7.4 External Link Checker (Navigation category)

Dreamweaver's built-in link checker (Site figs/u2192.gif Check Links Sitewide) does not verify external links (see Chapter 6 and Chapter 7 for details). However, the External Link Checker extension, by Scott Richards, automatically checks external links (therefore, it requires an active Internet connection).

After installing the extension, check external links in the current document by using Command figs/u2192.gif Check External Links. Check external links for all files selected in the Site window by using Site figs/u2192.gif Check External Links in the Site window (Windows) or main menu bar (Macintosh). These options open the External Link Checker dialog box, shown in Figure 22-5.

Figure 22-5. The External Link Checker extension
figs/dwn_2205.gif

Version 1.0.0 of the External Link Checker extension is often unreliable and may fail to validate all external links in the chosen documents. It also does not verify email address links. You may prefer to use Dreamweaver's built-in link checker to generate a list of external URLs that you can verify by hand. Avoid linking to pages deep within other web sites, as site structures change often. Consider linking to the home page of other sites instead.

In the External Link Checker dialog box, click the Save Log button to copy the verification results to a file. Click the Status Codes button to display a list of HTTP status codes, as shown in Figure 22-6 (these codes help diagnose the cause of unreachable external links).

Figure 22-6. HTTP status codes
figs/dwn_2206.gif

The External Link Checker does not alter your HTML document or allow you to correct links automatically, but it does identify the HTML documents containing unreachable links. If the problem is a bad URL, correct the link by hand (remember that a site might be temporarily unavailable even if the URL is correct) .

22.1.7.5 dHTML Scrollable Area (DHTML/Layers category)

Creating scrollable layers is difficult due to differences in Netscape and Internet Explorer. The dHTML Scrollable Area behavior, by David G. Miles, creates scrollable layers that work in 4.0+ browsers using four separate <div> elements. (Note that this extension is listed at the end of the DHTML/Layers category, and not in alphabetical order, in the Dreamweaver Exchange.) After installing the extension, insert a scrollable layer by using Insert figs/u2192.gif AP Scrollable Area or the Insert Absolutely Positioned Scrolling Layer icon in the Objects panel's Goodies category. Configure the object settings in the Create Absolutely Positioned Scrollable Layer dialog box. The Positioning tab of the dialog box, shown in Figure 22-7, controls the size, placement, and scrolling speed of the layer.

Figure 22-7. Create Absolutely Positioned Scrollable Layer Positioning tab
figs/dwn_2207.gif

The dialog box's Content tab (not shown) allows you to enter the layer's content, which can be any content other than nested layers (which aren't supported in NN4). When using this extension, use the Commands figs/u2192.gif Add/Remove Netscape Resize Fix option to ensure that Netscape browsers will refresh properly when the browser window is resized.

22.1.7.6 Check Page for Accessibility (Accessibility category)

The Check Page for Accessibility extension, by Macromedia, checks whether special-needs browsers can view your web pages. Site accessibility is important not just for disabled users, but also for alternative devices and text-based browsers. For example, a site that is readable by text-based browsers that then convert the text to audio is useful for both blind users and car drivers who can't take their eyes off the road. Sites than comply with accessibility standards are more likely to work with existing browsers and are less likely to fail in future browsers (reducing maintenance costs).

Once you install the extension, run it by selecting Commands figs/u2192.gif Check Page for Accessibility, which opens the dialog box shown in Figure 22-8. Select the accessibility standard conformance options in this dialog box and click OK to analyze the page.

Figure 22-8. The Check Page for Accessibility extension
figs/dwn_2208.gif

Dreamweaver displays an evaluation report listing the line number, element, and accessibility problems within the document.

22.1.7.7 Dreamweaver Platform SDK (Scripting category)

The Dreamweaver Platform SDK extension, by Macromedia, helps you create extensions for Dreamweaver, Fireworks, and UltraDev. This extension helps you add objects, scripts, and behaviors to your Dreamweaver UI. The extension adds the SDK Samples category to the Objects panel and adds the Insert figs/u2192.gif SDK Samples menu to Dreamweaver's menu bar, as shown in Figure 22-9.

Figure 22-9. Locations of SDK samples additions in Dreamweaver's UI
figs/dwn_2209.gif

The SDK extension also adds tools under the Commands figs/u2192.gif SDK Tools submenu. Figure 22-10 shows the Show Document Structure dialog box, opened by selecting Commands figs/u2192.gif SDK Tools figs/u2192.gif Show Document Structure. This dialog box allows you to view the actual structure of your document, including comments but excluding content.

Figure 22-10. The Show Document Structure dialog box (part of Platform SDK extension)
figs/dwn_2210.gif

When developing complex web sites, such as those that use HTML, XML, and JavaScript, the structure information helps you spot errors in your code. For more details on the SDK extension consult the help files it installs in the Dreamweaver4/SDK/Docs directory.

22.1.7.8 Open Picture Window Fever! (Productivity category)

The Open Picture Window Fever! extension, by Drew McLellan, opens a minimalist browser pop-up window that is the same size as the selected image. Once installed, this extension adds the Fever figs/u2192.gif Open Picture Window Fever behavior to the Add Behavior (+) pop-up menu of the Behaviors panel.

This extension is perfect for opening large versions of thumbnail images in photo albums. Apply it to the thumbnails created with Dreamweaver's Commands figs/u2192.gif Create Web Photo Album option to open the larger photo without requiring the screen real estate associated with a full browser window.

22.1.7.9 Set Permissions (Productivity category)

The Set Permissions extension, by Jay London, allows you to set the permissions of a file on a remote Unix server. To set the permissions of a remote file, right-click (Windows) or Ctrl-click (Macintosh) on a file in the Remote Files pane of the Site Files window and select the Set Permissions option from the contextual menu. Choosing this action opens the File Access Properties dialog box, shown in Figure 22-11, where you can set the file permissions.

Figure 22-11. The File Access Properties dialog box
figs/dwn_2211.gif

This command instructs the Unix file server to change the file permissions using the chmod command (for more information on chmod , see Web Design in a Nutshell by Jennifer Niederst (O'Reilly)). The Set Permissions command works only on Unix servers accessed through FTP connections.

22.1.7.10 Table of Contents (Navigation category)

The Table of Contents extension, by Scott Richards, converts a series of named anchors or headings into a linked table of contents (TOC). After installing the extension, you can insert a TOC into your document by using Commands figs/u2192.gif Create Table of Contents. The Create Table of Contents dialog box, shown in Figure 22-12, allows you to select what types of HTML elements to use for the TOC.

Figure 22-12. The Create Table of Contents dialog box
figs/dwn_2212.gif

A TOC is a great complement to a graphical site map. You can also use the extension to generate a TOC for a lengthy HTML document, such as an online user manual.

22.1.8 Password Protection and eCommerce

There are hundreds of extensions that we don't have room to cover here. Furthermore, we didn't cover several commonly requested features for which Dreamweaver UltraDev is better suited than Dreamweaver. Features that depend on the web server software, such as password protection and eCommerce, are better implemented using UltraDev.

UltraDev's Server Behaviors panel includes server-side behaviors for user authentication, such as the Restrict Access To Page behavior. If you implement password protection yourself, be aware that different servers use different methods for password protection. The ColdFusion Server's password mechanism is described in Programming ColdFusion by Rob Brooks-Bilson (O'Reilly). The Apache server uses an .htpasswd file to password protect a directory, as described in Stephen Spainhour and Robert Eckstein's Webmaster in a Nutshell (O'Reilly). If you are using other servers, such as IIS, consult your webmaster, ISP, or server documentation for details on password protecting your site or a portion of your site.

The UltraCart extension, available from http://www.powerclimb.com/powerclimb/Behaviors.htm, is an eCommerce shopping cart solution. See the eCommerce category in the Dreamweaver Exchange and UltraDev Exchange for the UltraCart Patch for UD4 extension by Joseph Scavitto and other third-party eCommerce solutions.

Dreamweaver and UltraDev extensions aren't the only way to add functionality to your site. For example, freely available CGI scripts implement many useful functions even though they aren't well-integrated into Dreamweaver's UI (see the resources cited in the preface).



Dreamweaver in a Nutshell
Dreamweaver in a Nutshell
ISBN: B000C4SPTM
EAN: N/A
Year: 2005
Pages: 208

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net