adobe dreamweaver cs5 on demand part 68 pptx

ptg
420 Chapter 17
If you choose not to update a library item when you edit it, you can still
update it later using the Update Current Page or Update Pages com-
mands. The Update Current Page allows you to update the active docu-
ment in the Document window, while the Update Pages command
allows you to update the entire Web site. In addition to updating library
items, you can also rename individual items or delete the ones you no
longer use.
Working with Library
Items
Update Library Items on a Page
or an Entire Site
Open the Web page with library
items you want to update.
Update the library items using
either of the following methods:
◆ Update Current Page. Click the
Modify menu, point to Library,
and then click Update Current
Page.
◆ Update Entire Site. Click the
Modify menu, point to Library,
click Update Pages, specify
what to update in the Look In
list arrow, select the Library
Items check box, and then click
Start.
2
1
1

2
Did You Know?
You can customize the highlight color
of library items.
Click the
Dreamweaver (Mac) or Edit (Win)
menu, click Preferences, select the
Highlighting category, select the
Library Items check box, select a high-
lighting color, select the Show check
box, and then click OK.
You can show or hide highlighting.
Click the View menu, point to Visual
Aids, and then click Invisible Elements.
From the Library of Wow! eBook
ptg
Chapter 17 Using Code Snippets and Libraries 421
Rename or Delete a Library Item
Open the Web page with library
items you want to rename or
delete.
Click the Window menu, and then
click Assets to display the Assets
panel.
Click the Library category.
Select the library item you want to
rename or delete.
Use any of the following methods:
◆ Rename a Library Item. Right-
click the library item, click

Rename, type a new name, and
then press Enter (Win) or
Return (Mac).
◆ Delete a Library Item. Right-
click the library item, click
Delete, or click the Delete
button, and then click Yes to
confirm the deletion.
5
4
3
2
1
2
4
1
5
Did You Know?
You can recreate a missing or deleted
library item.
Select the item on one of
your pages, open the Properties panel,
and then click the Recreate button.
From the Library of Wow! eBook
ptg
422 Chapter 17
As you develop a site, you use some Dreamweaver behaviors and
JavaScript code constantly. The basic rollover image, for example, is so
useful for navigation bars, you may end up putting it on every page of
your site. Unfortunately, each time you add a behavior to a page,

Dreamweaver adds lines of JavaScript code as well, and more code
means slower downloads. You usually end up using the same behaviors
repeatedly, so it makes sense to collect these functions and save them
in an external JavaScript file. External JavaScripts help you speed up
the download of your Web pages. When the scripts are downloaded,
they are cached on the visitor's computer. Once your scripts are
cached, each subsequent page that is downloaded only requires the
browser to download the HTML… and not the scripts, which saves
time. You can create a JavaScript file (.js) in Dreamweaver or an exter-
nal editor, and then copy the JavaScript code that Dreamweaver pro-
duces or enter your own code in the JavaScript file (.js) and save it in
your site folder (typically in a folder called Scripts) for easy access
from the Assets panel.
Creating an External
JavaScript Library
Create a JavaScript File in
Dreamweaver
Click the File menu, and then click
New.
The New Document dialog box
opens.
Click the Blank Page category.
Click the JavaScript page type.
Click Create.
Enter your JavaScript code, or
copy and paste Dreamweaver
generated JavaScript code
(located in Code view) in the
JavaScript file.
Click the File menu, and then click

Save.
Navigate to the folder location in
your local root site folder where
you want to store the script file,
typically called Scripts folder.
Enter a name for the script file.
Click Save.
9
8
7
6
5
4
3
2
1
4
3
2
From the Library of Wow! eBook
ptg
Chapter 17 Using Code Snippets and Libraries 423
Create an External JavaScript
Library Item by Dragging
Open the local root site folder for
your Web site from the desktop.
Drag the user-created JavaScript
file from the desktop into the
internal folder named, Scripts.
Open Dreamweaver.

Click the Site menu, point to
Manage Sites, select the site that
you dragged the JavaScript code,
and then click Done.
Click the Window menu, and then
click Assets to display the Assets
panel.
Click the Scripts category.
Click the Refresh button.
The new JavaScript code appears
in the Assets panel.
7
6
5
4
3
2
1
1
2
7
4
6
5
Assets panel
Did You Know?
You can create an external JavaScript
library item by dragging a JavaScript
file directly to a page.
Open a page in

Dreamweaver, drag the user-created
JavaScript file (.js) from the desktop
directly to the page in Dreamweaver,
and then click Yes to save the code in
the active site folder (recommended).
Open the Assets panel, click the
Scripts category, and then click the
Refresh button to display the
JavaScript file.
From the Library of Wow! eBook
ptg
424 Chapter 17
After you create an external JavaScript file in Dreamweaver or another
external editor and store it in a folder, typically called Scripts, in your
local root site folder, you can insert the JavaScript into any page in
your site and reduce page download times. If you need to make a
change to an external JavaScript file, you can do it directly from
Dreamweaver using the Assets panel. When you make a change to a
JavaScript file, the new code is automatically used when the script is
called.
Inserting and Editing
an External
JavaScript
Insert an External JavaScript
Open the Web page you want to
insert an external script.
Click in the document where you
want to insert the JavaScript
code.
NOTE

If the script is to be
attached to the entire Web page,
click the <body> tag in the tag
selector at the bottom left of the
Document window.
Click the Window menu, and then
click Assets to display the Assets
panel.
Click the Scripts category.
Select the script you want
attached to the page.
TROUBLE?
If the script is not
available in the list, click the
Refresh button.
Click the Insert button.
Dreamweaver inserts the script
into the page.
6
5
4
3
2
1
6
3
2
4
5
1

Did You Know?
You can get free javascripts on the
Web.
Check out the free scripts at
www.java-script.net
. You can also per-
form a search for free javascripts from
additional Web sites.
From the Library of Wow! eBook
ptg
Chapter 17 Using Code Snippets and Libraries 425
Edit External Scripts
Click the Window menu, and then
click Assets to display the Assets
panel.
Click the Scripts category.
Select the script you want to edit.
Click the Assets Options button,
and then click Edit.
The script appears within a
window, the same size as the
current document window.
Make the necessary changes to
the script.
Click the File menu, and then click
Save.
Click the Close button to close the
JavaScript document.
7
6

5
4
3
2
1
1
2
3
4
7
5
6
From the Library of Wow! eBook
ptg
426 Chapter 17
A server-side include is a file that the Web
server uses in your pages when a browser
opens the page. In Dreamweaver, you can
insert server-side includes in your pages, edit
the includes, or preview pages containing
includes.
When you insert a server-side include in a
Web page, Dreamweaver places a reference
to an external file; the actual contents of the
server-side include are not placed in the file.
However, Dreamweaver displays the contents
of the server-side include in Design view to
make it easier to create and layout your
pages. In addition, you can preview your
pages in your browser to display them as if

they were on your Web server. When you dis-
play a page with a server-side include in your
browser, the server creates a new page insert-
ing the contents of the file and displays the
result. This can make updating files more flex-
ible, however it does take a little longer to dis-
play the page.
There are two types of server-side
includes: Virtual and File. The type you need
depends on the Web server you use. Some
servers can only use certain types of files for
server-side includes, so check the documenta-
tion of your server software to determine
which is the best type for you. Or, you can
just try each type to see which one works for
you.
Insert a Server-Side Include
Open the Web page where you want to
place the server-side include.
Click the
Insert
menu, and then click
Server-Side Include
.
Locate and select the server-side include
file you want to insert.
Click
OK
.
Modify a Server-Side Include

Open the Web page with the server-side
include you want to modify.
Select the server-side include.
Open the Properties panel.
Use the options in the Properties panel
to modify server-side settings or
change/update the server-side include
file.
◆ If your server is an Apache Web
server, click Virtual. This works well for
Apache Web server where File doesn’t
always.
◆ If your server is a Microsoft Internet
Information Server (IIS), click File. This
works well for IIS where Virtual only
works in certain circumstances.
4
3
2
1
4
3
2
1
Using Server-Side Includes
From the Library of Wow! eBook