17.8 Library Tutorial
In this tutorial, you'll turn the National Exasperater copyright notice into a reusable
Library item and add it to several pages in the site.
The tutorial in this chapter requires the example files from this book's Web site,
Click the Tutorials link to go to the tutorials page. Under Library Tutorial, click to download the
Windows or Macintosh files, depending on the kind of machine you're using.
After your browser downloads and decompresses the files, you should have a DWLib (short for Dreamweaver
Libraries) folder on your computer, containing the Web pages and graphics needed for this tutorial.
If you're having difficulties, the Web site contains detailed instructions for downloading the files you'll be
using with this book.
17.8.1 Creating a Library Item
Keep track of the location of the DWLib folder. You'll need it in the next step.
Following the instructions in Section 1.3.1, create a local site in Dreamweaver, choosing
the DWLib folder as the root folder.
Name the site DW Library and, in step 7 in Section 1.3.1, choose the DWLib file.
In the Site window, double-click the file index.html.
The home page opens.
Scroll to the bottom of the page and select the copyright notice.
Copyright information should be on every page of the site, so it makes a perfect
candidate for a Library item. Notice that the copyright information is more than
just text; it's actually a paragraph including a small image. The best way to select
it is to click inside the text, and then click the <p.copyright> tag in the status bar
of the document window (Figure 17-6).
Click <p.copyright> to
select the paragraph
containing the site's
Choose WindowAssets and click the Library button.
The Assets panel opens and displays the Library category.
Click the New Library Item button on the Assets panel.
A warning message appears, saying that the Library item may not look the same
in other pages. Dreamweaver is trying to tell you that Library items can only
contain HTML from the body of a Web page梟ot Cascading Style Sheets. (You
can still include HTML, such as this paragraph, that's had a style applied to it, as
long as you make sure that any pages to which you add the Library item have the
appropriate style sheets.)
The text in this example is formatted using a style sheet, so sure enough, it won't
look the same in pages that don't have the same style sheet. In this exercise, however,
that won't be a problem, since all the pages in the site share the same linked
external style sheet (see Section 6.1.2).
Click OK to dismiss the warning. The copyright-notice item appears in the Library
list, with an "Untitled" naming rectangle next to it.
Type copyright next to the new item on the Assets panel and press Enter.
You've just checked this standard blob of text into your Library. It's ready to use
anywhere else on your site.
In your Site window, double-click the file in the horoscopes folder called index.
Notice that this page is missing a copyright notice at the bottom of the page.
Drag the copyright Library item from the Assets panel to the bottom of the page,
as shown in Figure 17-7.
In addition to dragging a Library item into
the document window, you can also insert
the item, by placing the insertion point in
the document window and clicking the
Insert button on the Assets panel.
You can recognize the newly inserted Library item by its yellow background.
Click the text in the item and notice that you can't edit it: Dreamweaver treats it
like a single object.
Add the footer Library item to the other pages in the horoscopes folder.
There are twelve other pages in this folder. Open each page (by double-clicking
its name in the Site window) and repeat step 8. All right, you don't have to do all
of the pages, but at least do three or four to experience the full impact of what's
(You can close and save the pages as you go, or leave them open. Leave at least
one open at the end and go on to step 10.)
Notice the mistake!
The copyright notice has the wrong date. The year 2000 is long gone! Oh, great?
you'll have to change the date on every page. Fortunately, you've used a Library
item, so making the change will be a breeze.
Double-click the copyright item's icon (not its name) in the Assets panel.
The Library item opens up, ready for editing.
Change 2000 to the current year. Choose FileSave.
The Update Library Items dialog box appears, listing all of the pages in the site
that use the footer item.
Dreamweaver opens the Update Pages dialog box and updates all the Web pages
that use the footer item.
Click Close to close the Update Pages dialog box.
And now if you open a file in the horoscopes folder, you'll find that the copyright
date is correct.
Now imagine that you just used this auto-update feature on a 10,000-page site.
Sit back and smile.