Home / Articles / Adobe Dreamweaver / Customize Dreamweaver Using Extensions

Customize Dreamweaver Using Extensions

Chapter Description

As a Web developer, you might want to write an extension for Dreamweaver to handle a commonly used, and therefore repetitive, task. Or, you might have a unique requirement that you can satisfy only by writing an extension for the specific situation. In both cases, Dreamweaver provides an extensive set of tools that you can use to add to or to customize its functionality. This sample chapter discusses a number of ways you can extend Dreamweaver to suit your Web development needs.

Typically, you create a Dreamweaver extension to perform one of the following types of tasks:

  • Automating changes to the user's current document, such as inserting HTML, CFML, or JavaScript; changing text or image properties; or sorting tables
  • Interacting with the application to automatically open or close windows, open or close documents, change keyboard shortcuts, and more
  • Connecting to data sources, which lets Dreamweaver users create dynamic, data-driven pages
  • Inserting and managing blocks of server code in the current document

You might want to write an extension to handle a commonly used, and therefore repetitive, task. Or you might have a unique requirement that you can satisfy only by writing an extension for that specific situation. In both cases, Dreamweaver provides an extensive set of tools that you can use to add to or customize its functionality.

When you create a Dreamweaver extension, you should follow the steps outlined in “Creating an extension” on page 10.

The following features of Macromedia Dreamweaver 8 let you create extensions:

  • An HTML parser (also called a renderer), which makes it possible to design user interfaces (UIs) for extensions using form fields, layers, images, and other HTML elements. Dreamweaver has its own HTML parser.
  • A tree of folders that organize and store the files that implement and configure Dreamweaver elements and extensions.
  • A series of application programming interfaces (APIs) that provide access to Dreamweaver functionality through JavaScript.
  • A JavaScript interpreter, which executes the JavaScript code in extension files. Dreamweaver uses the Netscape JavaScript version 1.5 interpreter. For more information about changes between this version of the interpreter and previous versions, see “How Dreamweaver processes JavaScript in extensions” on page 106.

Types of Dreamweaver extensions

The following list describes the types of Dreamweaver extensions that are documented in this guide:

Insert Bar object extensions create changes in the Insert bar. An object is typically used to automate inserting code into a document. It can also contain a form that gathers input from the user and JavaScript that processes the input. Object files are stored in the Configuration/Objects folder.

Command extensions can perform almost any specific task, with or without input from the user. Command files are typically invoked from the Commands menu, but they can also be called from other extensions. Command files are stored in the Configuration/Commands folder.

Menu Command extensions expand the Command API to accomplish tasks related to calling a command from a menu. The Menu Commands API also lets you create a dynamic submenu.

Toolbar extensions can add elements to existing toolbars or create new toolbars in the Dreamweaver UI. New toolbars appear below the default toolbar. Toolbar files are stored in the Configuration/Toolbars folder.

Report extensions can add custom site reports or modify the set of prewritten reports that come with Dreamweaver. You can also use the Results Window API to create a stand-alone report.

Tag Library and Editor extensions work with the associated tag library files. Tag Library and Editor extensions can modify attributes of existing Tag Dialogs, create new Tag Dialogs, and add tags to the tag library. Tag Library and Editor extension files are stored in the Configuration/TagLibraries folder.

Property Inspector extensions appear in the Property inspector panel. Most of the inspectors in Dreamweaver are part of the core product code and cannot be modified, but custom Property inspector files can override the built-in Dreamweaver Property inspector interfaces or create new ones to inspect custom tags. Inspectors are stored in the Configuration/Inspectors folder.

Floating Panel extensions add floating panels to the Dreamweaver UI. Floating panels can interact with the selection, the document, or the task. They can also display useful information. Floating panel files are stored in the Configuration/Floaters folder.

Behavior extensions let users add JavaScript code to their documents. The JavaScript code performs a specific task in response to an event when the document is viewed in a browser. Behavior extensions appear on the Plus (+) menu of the Dreamweaver Behaviors panel. Behavior files are stored in the Configuration/Behaviors/Actions folder.

Server Behavior extensions add blocks of server-side code (ASP, JSP, or ColdFusion) to the document. The server-side code performs tasks on the server when the document is viewed in a browser. Server behaviors appear on the Plus (+) menu of the Dreamweaver Server Behaviors panel. Server behavior files are stored in the Configuration/Server Behaviors folder.

Data source extensions let you build a connection to dynamic data stored in a database. Data source extensions appear on the Plus (+) menu of the Bindings panel. Data source extension files are stored in the Configuration/Data Sources folder.

Server Format extensions let you define formatting for dynamic data.

Component extensions let you add new types of components to the Components panel. Components is the term that Dreamweaver uses to refer to some of the more popular and modern encapsulation strategies, including web services, JavaBeans, and ColdFusion components (CFCs).

Server model extensions let you add support for new server models. Dreamweaver supports the most common server models (ASP, JSP, ColdFusion, PHP, and ASP.NET). Server model extensions are needed only for custom server solutions, different languages, or a customized server. Server model files are stored in the Configuration/ServerModels folder.

Data translator extensions convert non-HTML code into HTML that appears in the Design view of the document window. These extensions also lock the non-HTML code to prevent Dreamweaver from parsing it. Translator files are stored in the Configuration/Translators folder.

Other ways to extend Dreamweaver

You can also extend the following elements of Dreamweaver to expand its capabilities or tailor it to your needs.

Document types define how Dreamweaver works with different server models. Information about document types for server models is stored in the Configuration/DocumentTypes folder. For more information, see “Extensible document types in Dreamweaver” on page 35.

Code snippets are reusable blocks of code that are stored as code snippet (CSN) files in the Dreamweaver Configuration/Snippets folder and which Dreamweaver makes accessible in the Snippets panel. You can create additional code snippet files and install them into the Snippets folder to make them available.

Code Hints are menus that offer a typing shortcut by displaying a list of strings that potentially complete the string you are typing. If one of the strings in the menu matches the string that you started to type, you can select it to insert it in place of the string that you are typing. Code Hints menus are defined in the codehints.xml file in the Configuration/CodeHints folder, and you can add new code hints menus to it for new tags or functions that you have defined.

Menus are defined in the menus.xml file in the Configuration/Menus folder. You can add new Dreamweaver menus for your extensions by adding the menu tags for them to the menus.xml file. For more information, see Chapter 8, “Menus and Menu Commands,” on page 181.

2. Configuration folders and extensions | Next Section