Wellesley Computing Logo

Dreamweaver
MX
Macintosh and Windows

Site Management Features in Dreamweaver MX

For Beginners What's New in Dreamweaver MX Basic Features Menus and Media
Managing a Site Creating Forms Cascading Style Sheets Web Resources

Table of Contents

Using the QuickTag Editor

The QuickTag editor allows you to efficiently enter tags for selected material without opening the source window to edit the source.

To add an HTML tag with the QuickTag Editor:

  1. Select/highlight the object (text, image, etc.) to which you would like to add the tag.
  2. From the Modify menu, choose QuickTag Editor
  3. A small box will appear with an html tag. A drop down menu with all possible tags to apply will also appear after a short time. Double-click on a tag from the list.
  4. Click back on the document when you are finished.

Creating Temporary Commands

Sometimes we must repeat the same steps in our web pages over and over again. For example, we may want to change all of our section headings to blue, Times New Roman and size 5. Dreamweaver makes it possible to create a Temporary Command so that you can do all of the steps with one click.

A Temporary Command will last until you quit out of Dreamweaver, or until you create a new Temporary Command. You can close a document and open another (as long as you don't quit out of Dreamweaver in the process) and still use the Temporary Command that you created.

Unfortunately, Dreamweaver cannot record any mouse movements as part of your Temporary Command. Any clicks or drags will prompt an error message.

To create a Temporary Command:

  1. From the Commands menu, choose Start Recording
  2. Execute the steps that you would like to put in your command (Remember, Dreamweaver cannot record your mouse movements such as clicks and drags. If you are performing a command on text, for example, highlight the text and then start recording the command.)
  3. From the Commands menu, choose Stop Recording
  4. To execute the command, from the Commands menu, choose Play Recorded Command

Using the History Inspector

The History Inspector records your actions in a Dreamweaver document, and allows you to perform several useful functions including multiple undos, repeating an action or group of actions, and creating "permanent" commands. Unfortunately, it cannot record many mouse movements, but all keystrokes are recorded as well as menu choices and actions in the Properties Inspector.

By default the History Inspector records up to 50 actions, but you can alter this number in the Dreamweaver Preferences. The History Inspector maintains a separate list of actions for every document that you have open and empties out as soon as you close a document.

The History Inspector Explained:

To perform multiple undos at once:

  1. From the Window menu, under Others, choose History to open your History Inspector.
  2. Scroll to find the last step that you would like to include.
  3. Click on the gray vertical bar on the left of the History Inspector window next to the last step that you would like to include.
  4. All of the steps after the one you selected will be undone and will be shaded in gray in the History Inspector
  5. If you change your mind, you can continue clicking until you have determined the correct number of undos that you want.

As soon as you perform a new action ALL of the grayed out actions will be permanently erased from the History Inspector and cannot be recovered. You will have to perform these steps again.

Note: You cannot pick and choose the actions that you would like to undo. You can only select the actions from the end of the History Inspector list.

To repeat an action or series of actions:

  1. From the Window menu, choose History to open your History Inspector.
  2. Select the actions that you would like to repeat by clicking on them.
  3. If you would like to repeat more than one action, hold down the SHIFT key while you select them.
  4. When you have selected all of the actions that you would like to repeat, click on the Replay button in the History Inspector window.

Note: The selected actions cannot be replayed out of order.

Creating a Permanent Command

In Dreamweaver, a "Permanent" Command is one that appears in the Commands menu. You can add and delete your own commands from this menu. Because you can delete these commands, they are not truly permanent, but they will remain in the Commands menu even after you have quit out of the Dreamweaver.

To create a "Permanent" Command:

  1. From the Window menu, under Others, select History to open the History Inspector.
  2. Perform the actions that you would like to record as a permanent command.
  3. In the History Inspector, select the actions you would like to save as a command.
  4. If there are multiple actions, hold down the SHIFT key as you select them.
  5. When you have all of the actions selected, click on the disk button in the bottom right corner of the History Inspector window.
  6. When prompted, enter a command name and click OK
  7. The command is now saved in the Commands menu.

To delete a "Permanent" Command:

  1. From the Commands menu, choose Edit Command List
  2. Select the command you would like to delete by clicking on it once.
  3. Click on the Delete button.

Creating a Site Definition

Before using any of the following advanced features in Dreamweaver, you must first create a Site Definition for the web site files that are stored on your local computer. To do this, all of the HTML and graphic files (.gif and .jpg) for the web site must be saved in the same folder on your computer.

If you do not already have a "site" folder on your computer that contains all of these files, you will need to create one.

  1. Create a new folder on your desktop (or wherever you would like your web files to be saved).
  2. Find all of the HTML and graphics files for your web site.
  3. Drag the files to the new folder that you created.

IMPORTANT: If you have your files stored in different folders, drag each FOLDER into the new site folder. Removing the files from your folders will result in broken links and missing images!

To create a Site Definition:

  1. From the Site menu, choose New Site...
  2. A site definition window will open on your screen.
  3. Verify that Local Info is selected in the Category list on the left.



  4. Type a name in the Site Name field. This name appears nowhere on your web site and is used only by Dreamweaver.
  5. Click on the folder next to the Local Root Folder field and browse to find your site folder.
  6. Select your site folder and click Open then click Select
    (**on a Mac, select your site folder and click Choose)
  7. Now select Site Map Layout from the category list on the left.
  8. Click on the folder next to the Home Page field.
    Site Definition Dialog Box - Home Page Field
    and browse to find your site's home page in your site folder.
  9. Select your home page and click Open
  10. Click OK
  11. A window will appear asking you if you want to create a cache file for this site. Click Create
  12. A site map window will open after a few seconds letting you know that you have completed the process. You can close this site map window and continue working with your web page.

Note: This Site Definition now lives on the computer that you are currently working on. If you should remove the site files from this computer (move them to a disk or erase the folder) you will see an error message each time you open Dreamweaver asking you where the files have gone. If you remove the site files from your computer, you must also remove the Site Definition.

To remove a Site Definition from your computer

  1. From the Site menu, choose Edit Sites...
  2. In the dialog box, select the Site Definition you want to remove by clicking on it once.
  3. Click on the Remove button.
  4. Click on the Done button.

Using the Site Map

The Site Map feature allows you to browse through all of the files included in your Site's folder and provides a map of how these files are linked together in your web site To use this feature, you must create a Site Definition for your web site.

Opening the Site Map:

  1. From the Site menu, choose Site Map
  2. The Site Map window will open.
  3. On the right side of the window, there is a list of your Site's files arranged in their folders.
  4. On the left side of the window, there is a map of the files (beginning with the home page) and how they are linked together. External links are shown, but cannot be checked.

Using the list of files:

Using the Map:

Checking your local links

Dreamweaver provides a feature that will allow you to check all of the LOCAL links in your web site. Dreamweaver will check to make sure that the links between pages within your web site are correct and that you do not have any orphaned files (images or html files that are not included on your web pages). This feature will NOT check remote URLS that you have linked to. You must still check links to remote URLS on your own. For the link-checking feature to work, you must create a Site Definition for your web site.

Checking your links:

  1. Open one of the Site's HTML documents in Dreamweaver.
  2. From the File menu, under Check Page, choose Check Links
  3. A dialog box will appear.
  4. From the Show pull-down menu, you can choose to see the Broken Links in your site, a list of External Links (Dreamweaver does NOT verify that these links are working), and a list of Orphaned files
  5. Click Close to close the window.

Using Libraries

Libraries contain frequently used elements (images, text, tables, etc.) for your web site. Files contained in the Library are called Library Items and are references to the original items. Editing a library item will change the original item file. You can update the edited item in all files in the web site at once.

Note: In order to use the Template feature in Dreamweaver, you must first create a Site Definition for your web site.

Creating a Library Item:

  1. Select the part of the document to be used as a library item by clicking on it once.
  2. From the Modify menu, choose Library and then Add Object to Library
  3. Type in the name for the new library item.
  4. Close the Library window.

Deleting an Item from the Library:

  1. Open one of the Site's pages in Dreamweaver.
  2. From the Windows menu, choose Library
  3. Select the item you want to delete from the library by clicking on it once.
  4. Click on the trash can button in the lower right corner of the library window.
  5. Click Yes when asked if you want to delete the file.
  6. Close the Library window.

Note: Deleting the file from the Library does NOT delete the original file. The file is still stored in its original location, and will still appear in the document. If you delete a file from your Library, you will still need to return to the library items in your document and detach them from the Library.

Adding a Library Item to your document:

  1. Place the cursor in the document where you would like the Library Item to be inserted.
  2. From the Window menu, select Library
  3. Select the Library Item that you want to insert by clicking on it once.
  4. Click on the Insert button in the Library window to insert the item into the document.
  5. Close the Library window.

Editing a Library Item:

  1. Open one of the Site's pages in Dreamweaver.
  2. From the Window menu, select Library
  3. Open the Library Item by double-clicking on it.
  4. Edit the Library Item.
  5. When you have finished editing, from the File menu, choose Save
  6. A dialog box may appear asking you to update your files.
  7. Click Update to update all of the HTML documents that contain this Library Item.

Note: If the Update dialog box does not appear, it is likely that you may have (unknowingly) asked Dreamweaver to Update your library files automatically the last time you changed a Library Item.

Detaching an instance of an element from the Library Item:

There are times when you may need to edit only one instance of a Library Item on a specific web page. To do this, you will need to detach the instance from the Library Item.

Note: If you do this, you will no longer be able to update the detached instance automatically when the Library Item is changed.

  1. Select the instance of the Library Item in your document.
  2. In the Properties window, click Detach from Original

Using Templates

Although Dreamweaver offers a "template" feature, we have found that it is more complicated than the vast majority of our users need.

Instead of using templates we recommend that you use one html file as a base for all of the pages in your site.

  1. Create a new html file with your graphics, menus, and other design elements and save it with a recognizable filename such as sitedesign.html.
  2. From the File menu choose Save As
  3. Give the page a new name (english_home.html, campus_map.html, etc.)
  4. Add your text and then save the page.
  5. To start your next page, open your original sitedesign.html page and choose Save As again.
  6. You can continue doing this, creating all of the necessary pages for your site with the same design.

You can, of course, use the Dreamweaver template feature. To do so, follow the instructions available under the Dreamweaver Help menu.

 

Computing at Wellesley

Macintosh Documentation

PC Documentation