第11章 模板和库的应用

利用【资源】面板的功能可以统一管理整个站 点的资源，避免反复查找某些网页元素，能大 大提高网页设计的效率，得到事半功倍的效果。
【资源】面板管理对象：

【图像】 【颜色】 【超链接】 【Flash】 【Shockwave】

【视频】 【脚本】 【模板】

【库】
11.4
网 页 制 作 基 础 教 程
11.2
网 页 制 作 基 础 教 程
模板的基本操作
11.2.5 更新模板及页面
1.
修改模板
①
选择【窗口】｜【资源】命令，打开资源面板，切换到 【模板】资源。
②
选中要修改的模板后右击鼠标，在快捷菜单中选择【编
辑】命令，或双击该模板，便可打开要修改的模板.
③
在快捷菜单中选择【新建可编辑区域】╱【删除模板标 记】以添加或删除可编辑区域
模板的基本操作
11.2.2 模板的创建与保存
方法二：在【资源】面板创建模板
1.
在文件面板中选择要创建模板的站点。 选择【窗口】｜【资源】命令，打开【资源】面板，
2.
选定面板左侧的【模板】按钮，单击“添加”按钮。
方法三：利用现成网页创建模板
1.
打开欲做模板的网页。 选择【文件】｜【另存为模板】命令。
2.
11.4
11.4.1
网 页 制 作 基 础 教 程
资源管理
图像管理
(4)图片收藏夹： 添加：单击位于【资源】面板底端的【添 加到收藏夹】按钮，可将图片收藏到收藏 夹中。

查看：在【图像】管理窗口的顶端选择 【收藏】单选按钮，即可在图像列表栏中 查看站点中的图片收藏情况。 删除：单击位于【资源】面板底部的【从 收藏夹中删除】按钮后即可将图像从收藏 夹中删除。
1)
基本元素的制作 插入模板区域

2)
创建可编辑区域 创建重复区域

2.
创建基于模板的网页文档 修改模板并更新
3.
11.2
网 页 制 作 基 础 教 程
模板的基本操作
11.2.1
模板的基本特点
使用模板的好处在于： 1.可以生成大批的风格相近的网页。
2.一旦模板修改了，就修改了一批网页（自动 更新）。
2.
2.
在“资源”面板中，单击“库”类别底 部的“新建库项目”按钮。
3.
一个新的库项目被添加到面板上的列表 中。
为新的库项目输入一个名称。 双击该库项目，在文档窗口进行编辑。
4. 5.
11.3 库的应用
网 页 制 作 基 础 教 程
11.3.2
步骤：
1.
插入库项目
将文本光标定位于“文档”窗口中。 在“资源”面板上选择面板左侧的“库”类别。 将一个库项目从“资源”面板拖动到“文档”窗口 中，或者选择一个库项目，然后单击面板底部的 “插入”按钮。
步骤1 在已创建的模板文件中，编辑网页， 其布局、制作方法与普通网页完全一致。 步骤2 地方

将插入点放在想要插入可编辑区域的
步骤3 在插入栏中选择【模板】，然后单击 【可编辑区域】按钮。

步骤4 在【新建可编辑区域】对话框中，输 入该区域的名称,单击【确定】按钮

11.2
网 页 制 作 基 础 教 程
11.3 库的应用
网 页 制 作 基 础 教 程
11.3.1
创建库项目
创建库项目的方式有两种：
1.
选定内容创建为库项目。
2.
创建一个空白库项目
11.3 库的应用
1.
将选定内容创建为库项目
1.
网 页 制 作 基 础 教 程
步骤： 选择【窗口】｜【资源】命令，出现“资源”面板， 选择面板左侧的“库”类别。 在“文档”窗口中，选择文档要另存为库项目用
网 页 制 作 基 础 教 程
注意：
插入库项目后 ，会在“文档 ”窗口的下方出现 “库项目”属性检查器，如图所示。
“库项目”属性检查器 【从源文件分离】可以断开文档中的项目和库 之间的链接，从而使文档中的库项目可编辑。

11.3 库的应用
网 页 制 作 基 础 教 程
11.3.3

模板的基本操作
11.2.3 创建模板区域
1.
可编辑模板区域控制基于模板的页面中的 哪些区域可以编辑。设置可编辑区域，需 要在制作模板的时候完成。

不同部分（设为可编辑区域）

相似网页

完全一样部分（在模板中制作）
11.2
网 页 制 作 基 础 教 程

模板的基本操作
设置可编辑区域的具体步骤如下：
11.3 库的应用
11.3.3
网 页 制 作 基 础 教 程
修改库项目和更新站点
2.更新整个站点或所有使用特定库项目的文档： 选择【修改】｜【库】｜【更新页面】 3. 更改当前文档已使用所有库项目的当前版本 选择【修改】|【库】｜【更新当前页】
11.4
作用
网 页 制 作 基 础 教 程

资源管理
11.2.3 创建模板区域
2.
在模板中插入重复区域的操作步骤：
选择想要设置为重复区域的文本或内容。
①
② 选择“插入”|“模板对象”|“重复区域”。出现 “新建重复区域”对话框。 ③ 在“名称”文本框中为模板区域输入唯一的名称。 ④ 单击“确定”。 重复区域被插入到模板中。
11.2
网 页 制 作 基 础 教 程
11.2 模板的基本操作
网 页 制 作 基 础 教 程
2、模板的保存

新建的模板文件会保存在本地站点的 Templates文件夹中。

如果该Templates文件夹在站点中尙不存在， Dreamweaver CS4将在保存新建模板时自动创 建该文件夹。

模板文件的扩展名为.dwt。
11.2
网 页 制 作 基 础 教 程 创建可编辑区域
11.2.4
网 页 制 作 基 础 教 程
2.
①
模板的基本操作
创建基于模板的网页
使用资源面板
首先新建页面，通过【窗口】菜单打开资源面板 选择面板中的模板资源。
②
③
选中欲使用的模板，单击【应用】按钮；或将选中的
模板拖到编辑窗口。应用模板文档在右上角会标明模 板名称。
④
在应用了模板的文档的可编辑区域内编辑相关内容。
网 页 制 作 基 础 教 程
11.1.2
案例分析
在制作中，可利用模板来设计其相同部分，不同之处留 为可编辑区域和可重复区域，待在具体制作网页时，再将具 体内容填入可编辑区域和可重复区域。 可编辑区域
重复区域
11.1 应用模板制作相似网页
网 页 制 作 基 础 教 程
11.1.3
1.
实现步骤
制作模板
使用菜单方式
选择【文件】｜【新建】|【新建文档】|【模板】， 选择新建的页面存放的站点及所用模板名称。
②
选中【当模板改变时更新页面】的复选框时，当模板
被修改后，用此模板创建的网页也会被修改。
③
单击【创建】按钮，此时在网页编辑窗口建立了一个
由模板生成的网页，设计者可在可编辑区域输入相关
内容。
11.2
11.2
网 页 制 作 基 础 教 程 创建可重复区域

模板的基本操作
11.2.3 创建模板区域
2.
重复区域是可以根据需要在基于模板的页 面中复制任意次数的模板部分。

重复区域通常用于表格；但是，也可以为 其他页面元素定义重复区域。
11.2
网 页 制 作 基 础 教 程 创建可重复区域

模板的基本操作

11.4
11.4.2
网 页 制 作 基 础 教 程
1.
资源管理
颜色管理
打开[资源]面板：选择【窗口】｜【资源】命 令，或者按F10键。 打开[颜色]资源：单击【资源】面板左侧的 【颜色】按钮即可进入【颜色】管理窗口。 颜色收藏夹：单击位于【资源】面板顶端的 【收藏】单选按钮，切换到颜色收藏夹列表。
资源管理
选择【窗口】｜【资源】命令，或者直接按F10键， 可打开【资源】面板。
图像管理 颜色管理 链接管理 Flash管理 库管理 Shockwave 管理 视频管理 脚本管理 模板管理
11.4
11.4.1
网 页 制 作 基 础 教 程
资源管理
图像管理
【资源】面板能自动管理本地站点内的每一幅图像。 【资源】面板可对本地站点内的图像完成插入、编 辑和管理，其操作步骤如下: （1）打开[图像]资源：单击[资源]面板左侧的图 像按钮，可进入【图像】窗口。 (2) 插入图像：把光标定位在网页编辑窗口的图 像插入处，然后在图像列表中选中要插入的图像， 单击【插入】即可插入的图像。 (3) 编辑图像：在图像列表中选中要编辑修改的 图像，然后单击该面板底部的编辑按钮，启动 Dreamweaver CS4默认的图像编辑软件来对选中的图 像进行编辑与修改。
④
模板修改完成后，选择【文件】｜【保存】命令，保存
模板。
11.2
网 页 制 作 基 础 教 程
2.
模板的基本操作
更新页面：

保存模板时，Dreamweaver CS4会询问它是 否更新所有附着到该模板的网页。

也可以使用【修改】｜【模板】｜【更新页 面】命令。或【模板】资源窗口右上角的按
钮，选择【更新站点】命令，Dreamweaver
模板的基本操作
要点提示： 1.表格布局的模板定义可编辑区域时，可将整
个表格或表格的某个单元格定义为可编辑区 域，但是不能同时将多个单元格定义为一个 单独的可编辑区域。