|
The History Panel is one of those tools in Dreamweaver that many users don't
take full advantage of. When the panel is open it records all the actions you
make in an open document, up to a certain number of steps (as specified in
the General category of Dreamweaver's Preferences), and lets you take multiple
steps backwards with the use of the panel's slider.
Not only that, but when working with
pages in Dreamweaver, you can use the History panel to record, play, save,
and reuse your own custom Commands! Custom commands are great time-saving tools
when you build a lot of Web sites and know that you'll do certain things
repeatedly, such as inserting today's date or applying bold or italic tags
to a text selection.. In this article, you find out how to record and play
History panel commands.
Using the History Panel
To see the History panel press Shift + F10 or select Window > History. As
you modify the current open document you will begin to see how the History
panel records each action you make. For example, when you type in a line of
text, a typing layer appears in the History panel displaying the copy you just
entered, or when making a selection of text bold, an Apply Bold layer appears
in the panel. Each action in the document creates a new action layer in the
panel, as shown in Figure 1-1.
Figure 1-1. The History panel
To undo a step recorded in the History panel:
If you need to undo the last action taken
in the document, drag the slider on the history panel up a layer in the list.
This has the same effect as selecting Edit > Undo. Any
new action taken after you undo a step will completely overwrite the undone
action.
To undo multiple steps recorded in the History panel:
To do multiple undos
of several actions at once, either drag the slider on the History panel to
the desired layer step in the History panel or click on the slider bar next
to the step you want to revert to and the slider to scroll
automatically to that step. Any new actions taken after the undo will overwrite
the undone actions and create a new history for the document from that point
on.
To totally erase the document history in the History panel:
Though not advised, you may erase the entire history list for any open
document by selecting Clear History from the History panel's context
menu by right clicking (Win) or a Control + clicking (Mac) anywhere inside
the panel. Once this is done you will no longer be able to undo any steps
that were cleared for the current file.
Recording Commands with the History Panel
Before recording and saving a command, be sure the History panel is open in your
workspace. Then, after you perform the actions in your document, you can record
and save those actions steps by following the instructions below.
When recording commands be aware that some mouse movements—like selecting
objects by clicking and dragging—can't be saved or played back as part
of a saved command. Should they occur during the recording process, those
movements will be displayed in the History panel as a black mouse-movement
divider line between the steps. To avoid having those black lines appear,
go into Code view and make movements in the document by using the arrow keys.
For instance, you'd use the arrow keys in Code view if you'd like to reposition
the insertion point in the document before performing the next step of the
command you intend to save. When making a selection in Code view, remember
that you can also use the arrow keys plus the shift key to make or extend
a selection. In addition to the mouse movements that cant be recorded, there
are a few other actions that can't be recorded as part
of a saved command, such as dragging an object from one place on the page
to another. These types of actions will display a small red X
next to the action layer in the History panel. Figure 1-2 shows an example
of both the black lines and the red X.
Figure 1-2. Actions that can't be recorded display as black lines between other
actions or as an action layer with a red X.
Creating a Permanent Command
To record and save a new command, open your document in
the Dreamweaver workspace and follow the steps below:
- Press
Shift + F10 to open the History panel.
- Edit
your document as desired.
The
History panel will record all your actions as individual steps.
- Select
the step(s) in the History panel to be saved as a new command.
To
select multiple steps use the Shift + click technique to select consecutive
steps or the Control + click (Win) or Command + click (Mac) technique to select
or deselect non-consecutive steps.
- Click
the Record button at the bottom of the History panel.
The
button looks like a tiny floppy disk. Upon clicking it, Dreamweaver opens
a dialog box that lets you know if the command contained any steps where
you clicked or dragged in the document. Click Yes to continue, or No to
cancel the recording process.
The
Save As Command dialog box appears.
- Type
in a name the new command and click OK.
Name
your commands using simple descriptive titles such as “Bold & Italic”.
Upon
clicking OK, your new command will now appear by name at the bottom of
the Commands menu, as shown in Figure 1-3, for you to select and use again!
Figure 1-3. The Commands menu lists all custom commands.
TIP: New commands are saved as JavaScript or HTML files
in the Macromedia Dreamweaver Configuration/Commands folder of the computer
that created the command.
Creating a Temporary Command
Create temporary commands from a series of steps that can be copied and
pasted between files, so long as the source file remains open:
- Select the steps from the History panel that you'd like to record.
- Click the Copy selected Steps to the clipboard button at the bottom of
the History panel.
This loads the steps onto the computer's clipboard.
- Place your insertion point on the page where you'd like to "play" the
copied steps.
- Choose Edit > Paste to paste the steps into the document in Design view.
TIP: Even though each file has it's own history, steps can also be copied and pasted from one open document to another. Simply select the steps in the
first file and click the Copy Steps button on the History panel, then select
Edit > Paste in the new file to paste the copied steps.
Recording Commands with the Commands Menu
Besides recording a temporary command with the History panel, you may also
record one from the Commands menu. The temporary command can be played again
and again in any open file at any time until another temporary command is recorded
over it.
To record a temporary command:
- Select
Commands > Start Recording before performing the steps you want to “copy”.
You
can also start recording by clicking Control + Shift + X (Win) or Command + Shift + X (Mac).
- When
finished, select Commands > Stop Recording.
To play back a temporary command:
- Select
Commands > Play Recorded Command.
You
can also start the playback process by clicking Control + Shift + R (Win) or Command + Shift + R (Mac).
To save a temporary command into a permanent command with the History Panel:
- Select
Commands > Play Recorded Command.
This
will start to play back the command and display a new step called
Run Command at the bottom of the History panel.
- Select
the new Run Command step in the History panel and click the Save As Command button at the bottom of the History panel.
This
opens the Save As Command dialog box.
- Name
the new command and click the OK button to save it.
The
new command will appear at the bottom of the Commands menu.
SPECIAL TIP FOR TECHIES
If you happen to paste selected
steps into a text editor, Code view, or the Code inspector, you may notice
that the pasted information appears as JavaScript, which can be really
useful for learning to write your own scripts! For example, the copied
command to insert and resize an image like this:
<img src="image004.gif" width="89" height="77" />
may appear in a text editor as a bit of JavaScript like this:
dw.getDocumentDOM().insertHTML('<img src=\"image004.gif\">',
false);
dw.getDocumentDOM().resizeSelection('89', '77');
|
Playing Commands
The simplest way to play a saved command is to select it from the Commands
menu. For unsaved and unrecorded commands, however, use the History
panel. From there you may repeat the last step taken in a document, repeat
a series of consecutive or touching steps, or repeat a series of non-consecutive
steps.
To repeat a single step:
Select
a step in the History panel and click the Replay button.
This
performs the same action as choosing Edit > Redo (Action)
To repeat a series of consecutive steps:
Select
the steps in the History panel and click the Replay button.
To
select multiple steps either drag from one step to another or click the first
step then Shift + click the last step. Whichever steps are highlighted are
the ones that will be replayed.
To repeat a series of non-consecutive steps:
Select
a step in the History panel and Control + click (Win) or Command +click (Mac)
to select other steps, then click the Replay button. To deselect any of the
selected steps, Control + click (Win) or Command + click (Mac) on the step again.
Renaming and Deleting Commands
Newly saved commands can be renamed or deleted from the Commands menu, in
case you made a misspelling in one of the names or don't need a saved command
anymore. Select Commands > Edit Commands to open the Edit Command dialog
box, shown in Figure 1-4, where you'll find a list of all your customized and
saved History panel commands.
Figure 1-4. Edit Command names or delete Commands with the Edit Command
List dialog box.
To rename a saved command:
- Select
Commands > Edit Command List.
- Select
the command in the list and enter a new name.
- Click
the Close button.
To delete a saved command:
- Select Commands > Edit Command List.
- Select the command in the list and click the Delete button.
This permanently removes the command from the Commands menu.
- Click the Close button.
In addition to the custom commands you create yourself,
you can extend your copy of Dreamweaver with the Commands found on the Dreamweaver
Exchange website. Click the Get More Commands option from the Commands menu
in Dreamweaver to visit the Macromedia Dreamweaver Exchange website where you
can browse for and download additional commands: http://www.macromedia.com/cfusion/exchange/index.cfm?view=sn120
Happy History panel custom command making!
Sue Jenkins is a freelance web designer, graphic designer, artist,
illustrator, and author, she teaches Dreamweaver, Illustrator, and Photoshop
classes at Noble
Desktop in New York City, and offers private training to
companies in the New York area. Her first book, Dreamweaver 8 All in One
Desk Reference for Dummies, is due to be published by Wiley in July 2006. If
your company needs a website, website redesign, illustration or logo, see
Sue's consulting
page for more information,or go directly to her website
learn more about her design services http://www.luckychair.com
|
