第10章 模板和库的应用

10.2.1 模板的基本特点
使用模板的好处在于： 使用模板的好处在于： 1.可以生成大批的风格相近的网页。 1.可以生成大批的风格相近的网页。 可以生成大批的风格相近的网页
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程
10.2.2 模板的创建与保存
1.模板的创建方法 1.模板的创建方法 方法一： 方法一：通过菜单创建模板
网 页 制 作 基 础 教 程
10.2.2 模板的创建与保存
1.模板的创建方法 1.模板的创建方法
方法二： 方法二：在【资源】面板创建模板 资源】
1.
在文件面板中选择要创建模板的站点。 在文件面板中选择要创建模板的站点。 选择【窗口】｜【资源】命令，打开【资源】面板， 选择【窗口】｜【资源】命令，打开【资源】面板， 】｜【资源 选定面板左侧的【模板】按钮，单击“添加”按钮。 选定面板左侧的【模板】按钮，单击“添加”按钮。
《网页制作基础教程 CS3.0） （Dreamweaver CS3.0）》
电子教案
葛艳玲 主编
ISBN7－121－02882－4
第10章 模板和库的应用 10章
本章重点：模板、库的创建、编辑、 本章重点：模板、库的创建、编辑、 应用、修改，站点的更新。 应用、修改，站点的更新。 难点：如何合理的设置和定义模板 难点： 的可编辑区域。 的可编辑区域。
10.3 10.3 库的应用
网 页 制 作 基 础 教 程 使用库的意义：如果使用了库， 使用库的意义：如果使用了库，就可以通过改动 库更新所有采用库的网页， 库更新所有采用库的网页，不用一个一个的修改 网页元素或者重新制作网页。使用库比使用模板， 网页元素或者重新制作网页。使用库比使用模板， 有更大的灵活性。 有更大的灵活性。 库是一种用来存储想要在整个网站上经常重复使 用或更新的页面元素（如图像、文本和其他对象） 用或更新的页面元素（如图像、文本和其他对象） 的方法。 的方法。这些元素称为库项目
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程
3. 2.
10. 10.2.4 创建基于模板的网页 1. 使用菜单方式
1.
选择【文件】 新建】 新建文档】 模板】 选择 【 文件】 ｜ 【 新建】 | 【 新建文档 】 | 【模板】 ， 选择新建的页面存放的站点及所用模板名称。 选择新建的页面存放的站点及所用模板名称。 选中【当模板改变时更新页面】的复选框时， 选中 【 当模板改变时更新页面 】 的复选框时 ， 当模板 被修改后，用此模板创建的网页也会被修改。 被修改后，用此模板创建的网页也会被修改。 单击【创建】按钮， 单击 【 创建 】 按钮 ， 此时在网页编辑窗口建立了一个 由模板生成的网页， 由模板生成的网页 ， 设计者可在可编辑区域输入相关 内容。 内容。
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程
10.2.3 创建模板区域
1.
创建可编辑区域 可编辑模板区域控制基于模板的页面中的 哪些区域可以编辑。设置可编辑区域， 哪些区域可以编辑。设置可编辑区域，需 要在制作模板的时候完成。 要在制作模板的时候完成。 不同部分（设为可编辑区域） 不同部分（设为可编辑区域） 相似网页 完全一样部分（在模板中制作） 完全一样部分（在模板中制作）
10.2.3 创建模板区域
2.
创建可重复区域 重复区域是可以根据需要在基于模板的页 面中复制任意次数的模板部分。 面中复制任意次数的模板部分。
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程
①
10.2.3 创建模板区域
2.
创建可重复区域 在模板中插入重复区域的操作步骤： 在模板中插入重复区域的操作步骤：
保存模板时， CS3 会询问它是 保存模板时 ， Dreamweaver CS3 会询问它 是 所有附着到该模板的网页。 否更新所有附着到该模板的网页 否更新所有附着到该模板的网页。 也可以使用【修改】 模板】 也可以使用【修改】｜【模板】｜【更新页 命令。 模板】 面】命令。或【模板】资源窗口右上角的按 选择【 更新站点】 命令， 钮 ， 选择 【 更新站点 】 命令 ， Dreamweaver 在该模板所在的站点中更新基于模板的所有 网页文档。 网页文档。
2.
方法三： 方法三：利用现成网页创建模板
1.
打开欲做模板的网页。 打开欲做模板的网页。 选择【文件】｜【另存为模板】 选择【文件】｜【另存为模板】命令。 】｜【另存为模板
2.
10.2 模板的基本操作
网 页 制 作 基 础 教 程
2、模板的保存
新建的模板文件会保存在本地站点的 Templates文件夹中。 Templates文件夹中。 文件夹中 如果该Templates文件夹在站点中尙不存在， 如果该Templates文件夹在站点中尙不存在， Templates文件夹在站点中尙不存在 CS3将在保存新建模板时自动创 Dreamweaver CS3将在保存新建模板时自动创 建该文件夹。 建该文件夹。 模板文件的扩展名为.dwt。 模板文件的扩展名为.dwt。
可编辑区域 重复区域
10.1 10.1 应用模板制作相似网页
网 页 制 作 基 础 教 程
2) 1)
10.1.3 实现步骤
1.
制作模板 基本元素的制作 插入模板区域 创建可编辑区域 创建重复区域
2.
创建基于模板的网页文档 修改模板并更新
3.
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程 2.一旦模板修改了，就修改了一批网页（ 2.一旦模板修改了，就修改了一批网页（自动 一旦模板修改了 更新）。 更新）。
4.
2.
3.
在应用了模板的文档的可编辑区域内编辑相关内容。 在应用了模板的文档的可编辑区域内编辑相关内容。
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程
②
10. 10.2.5 更新模板及页面
1.
修改模板
①
选择【窗口】 资源】命令，打开资源面板， 选择【窗口】｜【资源】命令，打开资源面板，切换到 【模板】资源。 模板】资源。 选中要修改的模板后右击鼠标，在快捷菜单中选择【编 选中要修改的模板后右击鼠标，在快捷菜单中选择【 辑】命令，或双击该模板，便可打开要修改的模板. 命令，或双击该模板，便可打开要修改的模板.
10.1 10.1 应用模板制作相似网页
网 页 制 作 基 础 教 程
10.1.2 案例分析
在制作中，可利用模板来设计其相同部分， 在制作中，可利用模板来设计其相同部分，不 同之处留为可编辑区域，待在具体制作网页时， 同之处留为可编辑区域，待在具体制作网页时，再 将具体内容填入可编辑区域。 将具体内容填入可编辑区域。
1.
步骤： 选择【窗口】｜【资源】命令，出现“资源”面板， 选择【窗口】｜【资源】命令，出现“资源”面板， 】｜【资源 选择面板左侧的“ 类别。 选择面板左侧的“库”类别。 在“文档”窗口中，选择文档要另存为库项目的内 文档”窗口中， 容。 将选定内容拖到“资源”面板的“ 类别中， 将选定内容拖到“资源”面板的“库”类别中，或 者单击“资源”面板的“ 类别底部的“ 者单击“资源”面板的“库”类别底部的“新建库 项目”按钮，一个库项目被创建， 项目”按钮，一个库项目被创建，此时网页文档下 方的属性检查器也变为“库项目”检查器。 方的属性检查器也变为“库项目”检查器。 为新的库项目输入一个名称。 为新的库项目输入一个名称。
③
在快捷菜单中选择【新建可编辑区域】 在快捷菜单中选择【新建可编辑区域】╱【删除模板标 记】以添加或删除可编辑区域
④
模板修改完成后，选择【文件】 模板修改完成后，选择【文件】｜【保存】命令，保存 保存】命令， 模板。 模板。
10.2 10.2 模板的基本操作
网 页 制 作 基2 模板的基本操作
网 页 制 作 基 础 教 程
设置可编辑区域的具体步骤如下： 设置可编辑区域的具体步骤如下：
步骤1 在已创建的模板文件中，编辑网页， 步骤1 在已创建的模板文件中， 编辑网页， 其布局、制作方法与普通网页完全一致。 其布局、制作方法与普通网页完全一致。 步骤2 步骤2 地方 将插入点放在想要插入可编辑区域的
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程
10. 10.2.4 创建基于模板的网页
2.
1.
使用资源面板
首先新建页面，通过【窗口】 首先新建页面，通过【窗口】菜单打开资源面板 选择面板中的模板资源。 选择面板中的模板资源。 选中欲使用的模板， 单击 【 应用 】 按钮 ； 或将选中的 选中欲使用的模板 ， 单击【 应用】 按钮； 模板拖到编辑窗口。 模板拖到编辑窗口 。 应用模板文档在右上角会标明模 板名称。 板名称。
选择想要设置为重复区域的文本或内容。 选择想要设置为重复区域的文本或内容。
选择“插入” 模板对象 模板对象” 重复区域 重复区域” ② 选择“插入”|“模板对象”|“重复区域”。出现 “新建重复区域”对话框。 新建重复区域”对话框。 名称”文本框中为模板区域输入唯一的名称。 ③ 在“名称”文本框中为模板区域输入唯一的名称。 单击“确定” ④ 单击“确定”。 重复区域被插入到模板中。
要点提示： 要点提示： 表格布局的模板定义可编辑区域时， 1.表格布局的模板定义可编辑区域时，可将整
个表格或表格的某个单元格定义为可编辑区 域 ， 但是不能同时将多个单元格定义为一个 单独的可编辑区域。 单独的可编辑区域。
10.2 10.2 模板的基本操作
网 页 制 作 基 础 教 程 重复区域通常用于表格；但是， 重复区域通常用于表格；但是，也可以为 其他页面元素定义重复区域。 其他页面元素定义重复区域。
10.2 10.2 模板的基本操作