DREAMWEAVER 8
 
» Navigation
 
L E S S O N S
> Templates
> Rollovers
> XHTML
> CSS
E L E M E N T S
> Menu
> Library
> Panels
> File Menu
> Templates
> Editing Text
> Page Elements
>
L I N K S
> Tutorial
> Templates
> webmonkey

> communitymx
H O M E
computerschool.net


 
» Lessons & Exercises

LIBRARY

About library items
A library is a special Dreamweaver file that contains a collection of individual assets or copies of assets you have created for placement in your web pages. These assets in a library are called library items. You can update all the pages that use a library item whenever you change the item’s contents. You can store all sorts of page elements, such as images, tables, sounds, and Flash files in a library.

Here’s an example of how you might use a library item: suppose you’re building a large site for a company. The company has a slogan that it wants to appear on every page of the site, but the marketing department is still finalizing the text of the slogan. If you create a library item to contain the slogan and use that library item on every page, then when the marketing department provides the final slogan, you can change the library item and automatically update every page that uses it.

Dreamweaver stores library items in a Library folder within the local root folder for each site. Each site has its own library.

NOTE

If the library item contains links, the links may not work in the new site. Also, images in a library item aren’t copied to the new site.

When you use a library item, Dreamweaver doesn’t insert the library item in the web page; rather it inserts a link to the library item. That is, Dreamweaver inserts a copy of the HTML source code for that item into the document, and adds an HTML comment containing a reference to the original, external item.

The reference to the external library item makes it possible to update the content on an entire site all at once by changing the library item and then using the update commands in the Modify > Library submenu. Then, if you need to change some text for example, or an image, updating the library item automatically updates the instance of the library in any page in which you’ve inserted the library item.

When you create a library item that includes an element with a Dreamweaver behavior attached to it, Dreamweaver copies the element and its event handler (the attribute that specifies which event triggers the action, such as onClick, onLoad, or onMouseOver, and which action to call when the event occurs) to the library item file. Dreamweaver does not copy the associated JavaScript functions into the library item. Instead, when you insert the library item into a document, Dreamweaver automatically inserts the appropriate JavaScript functions into the head section of that document (if they aren’t already there).

NOTE

If you hand-code JavaScript (that is, if you create it without using Dreamweaver behaviors), you can make it part of a library item if you use the Call JavaScript behavior to execute the code. If you don’t use a Dreamweaver behavior to execute the code, the code isn’t retained as part of the library item.


There are special requirements for editing the behaviors in library items (see Editing a behavior in a library item). Library items cannot contain style sheets, because the code for those elements is part of the head section.

Creating a library item

You can create a library item from any element in the body section of a document, including text, tables, forms, Java applets, plug-ins, ActiveX elements, navigation bars, and images.

For linked items such as images, the library stores only a reference to the item. The original file must remain at the specified location for the library item to work correctly.

It can still be useful to store an image in a library item, though; for example, you could store a complete img tag in a library item, which would allow you to easily change the image’s text, or even its src attribute, throughout the site. (Don’t use this technique to change an image’s and height attributes, though, unless you also use an image editor to change the actual size of the image.)

To create a library item based on a selection:

  1. In the Document window, select a portion of a document to save as a library item.

  2. Do one of the following:

    • Drag the selection into the Library category of the Assets pane (Window > Assets).

    • Click the New Library Item button at the bottom of the Library category of the Assets panel (Window > Assets).

    • Select Modify > Library > Add Object to Library.

  3. Type a name for the new library item, then press Enter (Windows) or Return (Macintosh).

    Dreamweaver saves each library item as a separate file (with the file extension .lbi) in the Library folder of the site’s local root folder.

To create an empty library item:

  1. Make sure nothing is selected in the Document window.

    If something is selected, it will be placed in the new library item.

  2. In the Assets panel (Window > Assets), select the Library category on the left side of the panel.

  3. Click the New Library Item button at the bottom of the Assets panel.

    A new, untitled library item is added to the list in the panel.

  4. While the item is still selected, enter a name for it, then press Enter (Windows) or Return (Macintosh).

Inserting a library item in a document

When you add a library item to a page, the actual content is inserted in the document along with a reference to the library item.

To insert a library item in a document:

  1. Place the insertion point in the Document window.

  2. In the Assets panel (Window > Assets), select the Library category on the left side of the panel.

  3. Do one of the following:

    • Drag a library item from the Assets panel to the Document window.

    • Select a library item, then click the Insert button at the bottom of the panel.

Making library items editable in a document

If you’ve added a library item to your document and you want to edit the item specifically for that page, you must break the link between the item in the document and the library. Once you’ve made an instance of a library item editable, that instance cannot be updated when the library item changes.

To make a library item editable:

  1. Select a library item in the current document.

  2. Click Detach from Original in the Property inspector (Window > Properties).

    The selected instance of the library item loses its highlighting (if you had highlighting visible), and can no longer be updated when the original library item changes.

Editing a library item

When you edit a library item, you can update all documents that use that item. If you choose not to update, the documents remain associated with the library item; you can update them later.

Other kinds of changes to library items include renaming items to break their connection with documents or templates, deleting items from the site’s library and recreating a missing library  item.

To edit a library item:

  1. In the Assets panel (Window > Assets), select the Library category on the left side of the panel.

  2. Select a library item.

    A preview of the library item appears at the top of the Assets panel. (You can’t edit anything in the preview.)

  3. Do one of the following:

    • Click the Edit button at the bottom of the panel.

    • Double-click the library item.

    Dreamweaver opens a new window for editing the library item. This window is much like a Document window, but its Design view has a gray background to indicate that you’re editing a library item instead of a document.

  4. Edit the library item, then save your changes.

  5. In the dialog box that appears, select whether to update the documents on the local site that uses the edited library item:

    • Select Update to update all documents in the local site with the edited library item.

    • Select Don’t Update to avoid changing any documents until you use Modify > Library > Update Current Page or Update Pages.

To update the current document to use the current version of all library items:

  • Select Modify > Library > Update Current Page.

To update the entire site or all documents that use a particular library item:

  1. Select Modify > Library > Update Pages.

    The Update Pages dialog box appears.

  2. In the Look In pop-up menu, do one of the following:

    • Select Entire Site, then select the site name from the adjacent pop-up menu.

      This updates all pages in the selected site to use the current version of all library items.

    • Select Files That Use, then select a library item name from the adjacent pop-up menu.

      This updates all pages in the current site that use the selected library item.

  3. Make sure Library Items is selected in the Update option.

  4. Click Start.

    Dreamweaver updates the files as indicated. If you selected the Show Log option, Dreamweaver provides information about the files it attempts to update, including information on whether they were updated successfully.

To rename a library item:

  1. In the Assets panel (Window > Assets), select the Library category on the left side of the panel.

  2. Select the library item you want to rename, pause, then click again.

  3. When the name becomes editable, enter a new name.

  4. Click elsewhere, or press Enter (Windows) or Return (Macintosh).

  5. Dreamweaver asks if you want to update documents that use the item:

    • To update all documents in the site that use the item, click Update.

    • To refrain from updating any documents that use the item, click Don’t Update.

To delete a library item from a library:

  1. In the Assets panel (Window > Assets), select the Library category on the left side of the panel.

  2. Select the library item you want to delete.

  3. Do one of the following:

    • Click the Delete button at the bottom of the panel, then confirm that you want to delete the item.

    • Press the Delete key, then confirm that you want to delete the item.

    Dreamweaver removes the library item from the library, but doesn’t change the contents of any documents that use the item.

To recreate a missing or deleted library item:

  1. Select an instance of the item in one of your documents.

  2. Click the Recreate button in the Property inspector (Window > Properties).