Working with Commands

At the heart of task automation and workflow enhancement lie commands. Commands, located in the Commands menu, are prebuilt pieces of functionality that, when executed, perform various actions on your web pages such as cleaning up your HTML/XHTML code, applying Dreamweaver's source formatting to your HTML code, creating an automated web photo album, and more. Although we've already covered a couple commands in previous chapters (such as the Format Table and Sort Table commands), and others will be covered in future chapters, three commands stand out as workflow enhancement features and are covered in this chapter:

• Record Commands

• Apply Source Formatting

• Clean Up (X)HTML and Clean Up Word HTML

Recording New Commands

One of the benefits to working with commands in Dreamweaver is that they're not static; meaning that what you get out-of-the-box is not all you have to work with. Instead, Dreamweaver allows you to download free commands from the Dreamweaver Exchange (covered in Appendix B, "Extending Dreamweaver") or even create your own commands by recording the steps you take in Dreamweaver and then playing them back. Furthermore, you can highlight a number of steps in the History panel and save the steps as a command for use later in your web pages. This section explores the different options for working with self-made commands using the recording features in the Commands menu as well as the Save Selected Steps as a Command option from the History panel. Let's begin with the former. To record a new command, follow these steps:

1.	Create a new blank HTML page by choosing the New option from the File menu. Choose the HTML option from the Basic Page category and click the Create button.
2.	With the blank page open, choose Commands, Start Recording.
3.	Type the text Welcome to the Dorknozzle site!
4.	Press the Enter key.
5.	Choose Commands, Stop Recording.
6.	To play the newly recorded command, choose Commands, Play Recorded Command.

Alternatively, and quite possibly a quicker way of replaying a command, you can simply click the Replay button in the History panel while the Run Command step is highlighted in the list (see Figure 14.14). Doing this allows you to continuously replay the recorded command without having to access the Commands menu each time.

Figure 14.14. Click the Replay button in the History panel to replay a step listed in the History panel.

Although the process of recording a command and replaying it numerous times seems like a beneficial alternative to retyping the text each and every time, it does have its limitations. For instance, closing Dreamweaver or flushing the clipboard will delete the recorded command. What if you wanted to save the command so that you can use it in any site, at any time, even after you've closed and reopened Dreamweaver? To do this, you must create and save the command. You can do this by following these steps:

1.	To save a command, let's first backtrack out of what we've done by moving the slider in the History panel back up to the top of the list. Alternatively, you could choose the Clear History option from the History panel Options menu. Once again, enter the text Welcome to the Dorknozzle Site!
2.	Select the only entry in the History panel and click the Save As Command button (see Figure 14.15). The Save As Command dialog appears. Figure 14.15. Choose the only entry in the History panel and click the Save As Command button.
3.	In the Save As Command dialog, enter the text Dorknozzle Welcome and click OK.
4.	You can now access the command at any time by choosing the name from the Commands menu (see Figure 14.16). Figure 14.16. The new command appears in the Commands menu.

You can now access this command at any time, even if you close and reopen Dreamweaver. If you find that you're no longer using a command, you can remove it from the list by choosing Commands, Edit Command List. The Edit Command List dialog appears. You can rename and remove a command from the list. To remove a command from the list, choose the command and click the Delete button. Dreamweaver prompts you with a message asking whether you're sure you want to delete the command. Click Yes. The command is permanently deleted.

Apply Source Formatting

You can use the Apply Source Formatting command to reapply Dreamweaver's default tabs and indents to the HTML code of your web pages. Alternatively, you can use the Apply Source Formatting to Selection command to reapply Dreamweaver default formatting to a specific selection of code while you're in Code view. As an example of how the Apply Source Formatting feature works, follow these steps:

1.	Open a Dorknozzle page from the Files panel and switch to Code view.
2.	Highlight all the code by choosing the Select All option from the Edit menu or by pressing Ctrl+A in Windows or Command+A on a Mac.
3.	Click the Outdent Code icon (located third from the bottom in the Code toolbar) until all your code is lined up with the left edge of the Document window. The code resembles Figure 14.17. Figure 14.17. Remove the existing formatting from the HTML code.
4.	To reapply Dreamweaver's default formatting, choose the Apply Source Formatting command from the Commands menu. As you can see from Figure 14.18, indentations, tabs, and so on are reapplied, resulting in much cleaner and easier-to-decipher code. Figure 14.18. Reapply Dreamweaver's formatting by choosing the Apply Source Formatting option from the Commands menu.

As you saw in Chapter 3, "Building a Web Page," you can also use the Format Source Code icon, located last in the Code toolbar in Code view. Clicking this button displays a menu of options that includes the Apply Source Formatting and Apply Source Formatting to Selection commands.

Clean Up (X)HTML and Clean Up Word HTML

One of the last actions I perform before I call a web page complete (aside from using the Apply Source Formatting command) is the Clean Up (X)HTML command. Let's face it, although Dreamweaver writes excellent HTML in the background, there are many times where you'll add code, remove code, add some more code, remove some more code, and so on. Throughout the development life of the page, the code can become unsightly and might need a little attention. You can use the Clean Up (X)HTML command to clean up or fix problems with your code. For instance, you can use this command to search for and repair empty tags, redundant nested tags, non-Dreamweaver HTML comments, special markup that Dreamweaver may add, or even specific tags you want to specify. Furthermore, you can have the Clean Up HTML command combine nested <font> tags when possible and even show the results in a log when it's finished.

NOTE

Depending on the document type definition (DTD) of your document, the command name changes to either a Clean Up HTML or Clean Up XHTML option. Although the functionality exposed by the two options are similar, they warrant mention.

To demonstrate the use of the Clean Up HTML command, follow these steps:

1.	Begin by opening the page cleanuphtml.htm located in the Assets folder. The page is basic but contains numerous errors (most of which I purposely included) that we'll need to fix.
2.	Choose the Clean Up HTML option from the Commands menu. The Clean Up HTML dialog appears, similar to Figure 14.19. Figure 14.19. Run the Clean Up (X)HTML command.
3.	You can leave the default options selected because you'll use these most of the time. Click OK.
4.	Dreamweaver shows a log detailing the errors that were found and fixed.

You can also use the Clean Up Word HTML option to fix the code mess for which Microsoft Word's HTML editor is infamous. To demonstrate the use of this command, follow these steps:

1.	Open the page cleanupwordhtml.htm located in the Assets folder.
2.	Switch to Code view to see the 270 or so lines of code we'll need to clean up.
3.	Choose the Clean Up Word HTML option from the Commands menu. The Clean Up Word HTML dialog appears, similar to Figure 14.20. Figure 14.20. Run the Clean Up Word HTML command.
4.	We'll leave the default options selected because you'll use these most of the time. Click OK.
5.	As you can see in Figure 14.21, Dreamweaver shows a log, detailing the numerous errors that were found and fixed. Figure 14.21. Microsoft Word HTML files contain numerous problems; the Clean Up Word HTML command can detect and fix them.

Now switch to Code view and see the result. Dreamweaver compacted the code down to 30 or so lines!