2.2. Moving Library items to a new site
Although Library items are specific to each site,
they can be used in more than one site. When you make your first
Library item, Dreamweaver creates a folder called Library in the local
root folder for the current site. To move the Library item to a new
site, follow these steps:
Open the Library category from the Assets panel.
Right-click (Control+click) the Library item you want to move.
Put your mouse over the Copy to Site section of the context menu, and then choose the site you want to copy the Library item to.
Be sure to move any dependent files or other assets,
such as images and media files associated with Library items. The Copy
to Site function does not move dependent files.
|
|
2.3. Inserting a Library item in your Web page
When you create a Web site, you always need to
incorporate certain features, including a standard set of link buttons
along the top, a consistent banner on various pages, and a copyright
notice along the bottom. Adding these items to a page with the Library
items can be as easy as dragging and dropping them.
You must first create a Web site and then designate
Library items (as explained in the preceding section). After these
items exist, you can add the items to any page created within your
site. To add Library items to a document, follow these steps:
Position the cursor where you want the Library item to appear.
From the Library category, select the item you want to use.
Click the Insert button. The highlighted Library item appears on the Web page.
As noted earlier, you can also use the drag-and-drop method to place Library items in the Document window.
|
|
When you add a Library item to a page, you notice a
number of immediate changes. As mentioned, the added Library item is
highlighted. If you click anywhere on the item, the entire Library item
is selected.
Dreamweaver treats the entire Library item entry as
an external object being linked to the current page. You cannot modify
Library items directly on a page.
While the Library item is highlighted, notice that
the Properties panel also changes. Instead of displaying the properties
for the HTML object that is selected, the item is identified as a
Library item, as shown in Figure 2.
You can also see evidence of Library items in the
HTML for the current page. Open the Code inspector, and you can see
that several lines of code have been added. The following code example
indicates one Library item:
<!- #BeginLibraryItem "/Library/Copyright.lbi" -><span i
class="fineprint">Copyright © 2010</span><!- #EndLibraryItem ->
In this case, the Library item happens to be a phrase: Copyright © 2010. (The character entity ©
is used to represent the c-in-a-circle copyright mark in HTML.) In
addition to the span wrapping the copyright, notice the text before and
after the HTML code. These are commands within the comments that tell
Dreamweaver it is looking at a Library item. One line marks the
beginning of the Library item:
<!- #BeginLibraryItem "/Library/Copyright.lbi" ->
and another marks the end:
<!- #EndLibraryItem ->
Two items are of interest here. First, notice how the Library demarcation surrounds not just the text (Copyright © 2010)
but all its formatting attributes as well. Library items can do far
more than just cut and paste raw text. The second thing to note is that
the Library markers are placed discretely within HTML comments. Web
browsers ignore the Library markers and render the code in between them.
The value in the opening Library code, "/Library/Copyright.lbi",
is the source file for the Library entry. This file is located in the
Library folder, inside of the current site root folder. Library source (.lbi) files can be opened with a text editor or in Dreamweaver; they consist of plain HTML code without the <html> and <body> tags.
The .lbi file for the title example contains the following:
<span class="fineprint">Copyright © 2010</span>
The power of repeating elements is that they are
simply HTML. You need not learn proprietary languages to customize
Library items. Anything, except for information found in the header of
a Web page, can be included in a Library file.
The importance of the <!- #BeginLibraryItem> and <!- #EndLibraryItem>
tags becomes evident when you start to update Library items for a site.