22.1 Dreamweaver ExtensionsBy 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 ExchangeYou 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:
You can access the Dreamweaver Exchange in several ways:
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: Visit the Flash Exchange at: 22.1.2 Picking an ExtensionThe 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.
22.1.3 Downloading an ExtensionInstructions 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 ManagerThe 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:
Figure 22-1. Extension ManagerThe 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 ExtensionDownload an extension from the Dreamweaver Exchange prior to installation. Install an Extension (.mxp) file that was downloaded previously by:
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).
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 ExtensionsDisable an extension temporarily by unchecking the on/off checkbox next to its name in the Extension Manager window.
Remove an extension to disable it permanently by:
22.1.7 Useful ExtensionsThe 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.
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 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 categoryAdd 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 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 pageThe 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 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 boxIn 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 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 Check External Links. Check external links for all files selected in the Site window by using Site 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
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 codesThe 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 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 tabThe 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 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 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 extensionDreamweaver 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 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 UIThe SDK extension also adds tools under the Commands SDK Tools submenu. Figure 22-10 shows the Show Document Structure dialog box, opened by selecting Commands SDK Tools 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)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 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 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 boxThis 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 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 boxA 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 eCommerceThere 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). |