Macromedia Coldfusion MX 7 Web Application Construction Kit

Macromedia engineered Dreamweaver so as to give the user maximum control over the program's environment and tools. Customization is much more than being able to drag and drop panels and panel groups into various locations. This section will briefly discuss the following:

  • Commands. You can give a series of steps saved from the History panel a name and make them available in the Commands menu.

  • Keyboard Shortcuts. You can modify, create, or remove the current set's keyboard shortcuts. You can either create entirely new shortcut sets, or choose from the list of sets available.

  • Extensions. Additional functionality can be added to Dreamweaver through the use of third party extensions.

  • Preferences. You can set your preferences for everything from tag case to code coloring to code formatting and more.

NOTE

Dreamweaver's powerful extensibility layer allows users to customize their environment and workflow completely. If Dreamweaver lacks a feature, you can build an extension to do the job. Building extensions is beyond the scope of this book, however. You might consider looking at the documentation provided under Help > Extending Dreamweaver.

Commands

If you are JavaScript savvy, you can certainly write your own commands. However, Dreamweaver engineers have built a simple-to-use method of creating commands into the History panel (Figure 2.36). To access the History panel, select Window > Others > History or press Shift-F10. The History panel is disabled in Code view, and only steps created in Design view or steps not marked by a red X can be saved as commands. Select the step or multiple steps by Control-clicking each step. Then choose the "Save selected steps as a command" button or select Save As Command from either the contextual menu or the Options menu.

Figure 2.36. Custom commands can be simple text as shown here, or more complicated steps, as long as the steps aren't marked by a red X.

TIP

Choose the Replay steps button first to be sure the command yields the results you expect. Then you can select and save only the Replay Steps entry in the History panel.

You will be prompted to enter a name for the command, which will appear near the bottom of the Commands menu.

Keyboard Shortcuts

Using keyboard shortcuts for commonly used commands can tremendously improve your workflow. Some people find memorizing pre-assigned shortcuts difficult. Macromedia recognized that users would benefit from being able to assign their own keyboard shortcuts, so the company developed an easy-to-use keyboard shortcut editor (Figure 2.37). You can choose from the presets (BBEdit, Dreamweaver 3, HomeSite, and Macromedia Standard), or create your own based on an existing set.

Figure 2.37. The keyboard shortcut dialog offers an interface that allows you to add, edit, modify, or remove keyboard shortcuts for a variety of commands, including Snippets.

To create and modify your own keyboard-shortcut set:

1.

From the Dreamweaver menu, select Edit > Keyboard Shortcuts.

2.

The dialog will take a few moments to initialize. Once the Keyboard Shortcuts dialog becomes available, select the Duplicate Set button.

3.

In the Duplicate Set dialog box, enter a name for the new set.

4.

From the Commands Options menu, choose the type of command you wish to modify.

5.

Locate, then select the command listed in the tree menu for which you wish to edit or create a new keyboard shortcut.

6.

If a keyboard shortcut doesn't exist already in the Shortcuts text field, you can skip this step. You can have up to two shortcuts for each command. To add a second shortcut, you must first select the Add (+) button. This will create a blank space below the first shortcut.

7.

Position your cursor in the Press Key field, then press the keyboard shortcut you would like assigned to the command. If the shortcut is already in use, a warning message will appear.

8.

If another command is already using the shortcut but you would like to use it anyway, choose Change. If the shortcut is in use, you will receive an alert to let you know that the keyboard shortcut is taken. You can wish to disregard the message and make the change by choosing OK, which will remove the keyboard shortcut from the previous command and reassign it. Naturally, if the keyboard shortcut isn't already in use, choosing Change immediately updates the dialog.

You can change the name of a keyboard-shortcut set with the Rename Set button. Use the Export Set as HTML button to save an HTML listing of all keyboard shortcuts that you can preview in the browser and then print for handy reference. You can permanently discard a keyboard-shortcut set by selecting the set in the Current Set list, then choosing the Delete Set button.

Extensions

The depths to which Dreamweaver can go to include new functionality are truly amazing. Extensions can be as basic as an object that inserts a simple line of code, or as advanced as complete integration of a server model. Extension developers provide the Dreamweaver community with hundreds of useful extensions via the Macromedia Exchange for Dreamweaver (http://www.macromedia.com/exchange/dreamweaver) as well through third-party sites (http://www.dwfaq.com/resources/extensions).

The Dreamweaver installation includes an additional program known as the Extension Manager (Figure 2.38). Browse to the Extension Manager on your computer and launch it as you would any other program, or choose Commands > Manage Extensions.

Figure 2.38. The Extension Manager installs and displays information about the extension, such as version, author, description and access info.

To install an extension, make sure Dreamweaver MX 2004 is selected in the list and then choose one of the following options:

  • Select File > Install Extension

  • Click the Install New Extension button (Windows only)

  • Press Control-I (Command-O)

You will need to browse to the extension file (.mxp) that you downloaded to your computer and accept the Macromedia Extensions Disclaimer and third-party license agreement, if applicable. You'll then be prompted with the outcome of the installation, to which you should click OK.

Select the installed extension from the list to view the description and user interface access information in the area below. You can disable an extension by removing the checkmark beside it or permanently remove it by first highlighting the extension and then choosing one of the following options:

  • Select File > Remove Extension

  • Click the Delete Extension button (Windows only)

  • Press Control-R (Command- ) (minus key)

NOTE

The Extension Manager supports multiuser configurations. For more information, select Help > Using the Macromedia Extension Manager from the Extension Manager menu or press F1 and search for the phrase "Installing and managing extensions in multi-user environments."

Preferences

Nearly everything imaginableokay, maybe not everything but a great dealis customizable in Dreamweaver's Edit Preferences dialog. To edit your preferences, select Edit > Preferences or use the Control-U (Command-U) keyboard shortcut. As in other Dreamweaver dialogs you have encountered, the categories appear on the left, and when one is selected, that category's options are on the right (Figure 2.39).

Figure 2.39. Select one of the categories listed on the left to view and modify your preferences on the right.

Describing every preference entirely is beyond the scope of this book. However, here are some of the most common preferences you can want to modify within each category:

  • General. As mentioned earlier, this category offers the option to change your workspace (Windows only), as well as add text labels to the objects in the Insert bar. You can also disable the dialogs shown when inserting objects so that their default values are inserted. If you're working in a document that's in a different language, Dreamweaver makes available the choice of 14 other dictionaries you can use with Text > Check Spelling or the Shift-F7 keyboard shortcut.

  • Accessibility. To accommodate additional code attributes needed for user friendliness, Dreamweaver prompts special accessibility dialogs, which appear when you insert the appropriate item into the pageusually through the Insert bar, Files panel, or Assets panel.

  • Code Coloring. You can customize practically every bit of code within Code view to appear in not only the color you prefer, but also against a desired background color and in italic, bold, underlined, or normal text. Highlight the Document Type listed, then choose the Edit Coloring Scheme button. You can also set the overall background color of Code view.

  • Code Format. Formatting your code exactly as you like it has never been easier. Options to use lowercase or uppercase for tags or attributes as well as indentation and line breaks can all be specified here. Use the Tag Library Editor link to access the dialog for additional formatting options.

  • Code Hints. You can disable code hints or tag completion if desired and determine how speedily they become visible. Code hints can appear for tag names, tag attributes, attribute values, function arguments, object methods and variables, and HTML entities. You can enable or disable each of the code hint menus. Use the Tag Library Editor link to access the dialog so that you can add additional tags and attributes to include in code hints as you edit documents.

  • Code Rewriting. Dreamweaver can help you correct coding errors such as invalid nesting of tags and missing or extra closing tags. If you enable rewriting, when you create links through dialogs or the Property inspector, Dreamweaver can encode special characters so the browser will read the URL correctly and display the page. Encoding of special characters is not limited to links, but includes all file paths, including those to images. You can also specify which files can never be rewritten by adding their extension type to the "Never Rewrite Code In Files With Extension" text box.

  • CSS Styles. This category gives you various options for the use of shorthand when developing style sheets. When editing a style sheet, you have the option to use shorthand if it was originally written using shorthand, or to always use the specified setting.

  • File Types/Editors. You can specify which files open automatically in Code view by adding their file extensions to the list. You can specify an external editor for modifying code-based documents. The editor will then be listed in the Edit menu or the context menu when the file is selected in the Files panel. Additional options allow you to specify external editors for various other file extensions.

  • Fonts. The text sizes used for documents of various encoding are easily modified in the Fonts category. You can also choose the system font and size to use for Code view and the Tag inspector.

  • Highlighting. Dreamweaver uses highlighting within the Design view of a document to help you distinguish regions of code. You can specify the colors used by Dreamweaver template regions, library items, and third-party tags. Live Data, such as record-set-dependent code, will use the untranslated color as its background color when you are editing the document. While you're viewing the document using Live Data preview, the data is pulled into Design view and uses the translated color as its background.

  • Invisible Elements. While editing in Design view, it's often important to be aware of certain underlying code such as line breaks, layers, and server-side code, and other elements. Invisible elements listed in this category show the iconalso known as a third-party tagthat denotes the invisible element in Design view. Server-Side Include rendering is also controlled in the Invisible Elements category, and when "Show Contents of Include" is disabled, Dreamweaver's performance will improve when working in Design view.

    TIP

    You can move the code associated with invisible element markers by dragging and dropping them into position within the Design view.

  • Layers. The default values for layers added through Insert > Layer is determined by the entries in the Layers category. When a browser is resized using Netscape 4, layers lose their correct positioning. The Netscape Resize Fix adds a piece of JavaScript code that forces the page to reload when resized.

  • Layout Mode. The Layout Mode category lets you specify a transparent GIF file for use as a spacer image that is inserted into tables created in Layout view. The colorings of table and cell outlines, cell highlighting and table background color are determined by the values listed in this category.

    NOTE

    The table background color serves as a visual reminder of which areas have not been specifically drawn. The color is not the actual attribute of the <table> tag; you must specifically choose the background color for each drawn table.

  • New Document. You can specify the new document file type to use if the New File Dialog is disabled, as long as the site definition hasn't declared a server model. You can also choose the default encoding used in the <meta> tag of new documents and whether you'd like the document to be XHTML compliant.

  • Office Copy/Paste. In this category you are given the options: Insert the content, Create a link, or Ask me each time, whenever copying and pasting from Microsoft Word or Microsoft Excel documents. The default is set to Ask me each time, so if you find you're always inserting content or always creating links, you can come back and adjust this preference.

  • Panels. When panels aren't docked with all other panels in the dock area or if you are on a Macintosh, panels will float above the workspace as long as the appropriate box is checked. If the panel is not marked to be Always on Top, it's hidden from view when other areas of the document window are given focus. Other than minimizing or moving other windows and panels, the only ways to bring the panel back are via its menu entry or keyboard shortcut.

  • Preview in Browser. Dreamweaver's Design view offers an approximation of what the page will look like when viewed in a browser. However, there is no substitute for the real thing. You can establish up to 20 different browsers to list in the File > Preview in Browser submenu. A temporary file is created and used to preview the file unless you've marked the option Preview Using Temporary File.

    NOTE

    You can install as many versions of Netscape as you like on your computer. However, you can't install multiple versions of Internet Explorer (Windows only).

  • Site. The Site category allows you to determine which side to view the local files on in the expanded Files panel. From this category, you can also specify whether you would like to be prompted to include dependent files when uploading and downloading files. Firewall information is stored in this category, since it's unlikely to change between sites. You can save files before uploading, and you can choose the Edit button to modify your list of defined sites using the Site Definition dialog.

  • Status Bar. The Status bar appears in the lower right portion of the Document window. The options in the Status bar category let you determine window sizes and connection speeds so you can approximate what your page will look like in a browser at the chosen size while in Design view and how fast it would download at the chosen speed.

  • Validator. Dreamweaver offers a built-in code validator, called from File > Check Page > Validate Markup or by using the Shift-F6 keyboard shortcut. The settings for validation are determined by a listing of various document specifications, marked by a checkbox if enabled. The Options button displays the Validation Options dialog, used to determine how and which types of results appear in the Validation panel.

    I encourage you to change preferences as much as you like and explore the various options. Information about each category is only a Help button away.

Категории