《第9章 模板和库的操作》由会员分享,可在线阅读,更多相关《第9章 模板和库的操作(18页珍藏版)》请在金锄头文库上搜索。
1、模板与库的操作,本 章 主 要 内 容,了解模板和库的基本概念、掌握模板和库的创建、插入、修改和更新熟悉从网页中分离模板和库的操作,概 述,模板是一种特殊类型的文档,用于设计固定的页面布局。用户可以基于模板而创建文档,从而创建的文档继承模板的页面布局。设计模板时,可以指定在基于模板的文档中创建可编辑区域。库是在web页上单独的资源或资源副本的集合,如表格、图像、文本等各种页面元素。这些元素被称为库项目。在使用库项目时,不是在网页中插入库项目,而是插入该项目的HTML代码副本,并添加一个包含对原始外部项目引用的HTML注释。 模板与库的区别在于,模板是一个网页也是一个独立的文件,而库项目则是在网
2、页中的一段HTML代码。,模板与库的概念,(1). 模板 模板是制作其他网页文档的基本文档,在Dreamweaver中利用模板可以帮助用户用统一的版面设计和创建网页。使用模板也为用户维护站点提供了方便,用户可以在极短的时间内重新设计网页外观以改变网站中的所有网页(2). 库 库通常用来储存用户网页的元素,如图片、文本或其他需要经常更新或重复使用的对象,这些对象称为库对象。当用户在网页中放置了库对象时,Dreamweaver会在该文档中插入有关该对象的源代码。注:库本身是一段是代码,而模板本身是一个文件。Dreamweaver 8将所有的模板文件放在站点根目录夹“Templates”下,扩展名为
3、“.dwt”;而库项目则放在每个站点的根目录文件夹“Library”下,扩展名为“.lbi”,创 建 模 板,1.概述 要创建一个模板有两种方法:一种是先建立一个空白模板,然后往模板中添加内容;另一种方法是先设计好页面,然后将该页面设置为模板。2. 创建空白模板方法如下:执行菜单命令“文件/新建”,打开“新建文档”对话框,在该对话框中选中“常用”类别的“模板页”,然后点击右边的“HTML”模板点击“创建”按钮,即创建一个新的空白模板页保存当前模板,弹出对话框,它提示用户正保存在文档中没有任何可编辑 区域,单击“确定”按钮即保存当前模板弹出“另存为模板”对话框,单击“保存”按钮,模板文件就会保存
4、在站点的本地根目录文件夹下“Templates”中,文件扩展名为“.dwt”。若“Templates”文件夹在站点中尚未存在,则Dreamweaver将在保存模板时自动创建该文件夹,创 建 模 板,注:模板文件一旦建成,则不要将它移到“Templates”文件夹之外或者将任何非模板文件放在文件夹中,此外,也不要将“Templates”文件夹移到本地站点根文件夹之外,否则会在模板的路径中引起错误模板建立后,执行菜单命令“窗口/资料”(快捷键F11),打开“资源”面板,在该面板中点击左侧模板按钮,就会显示刚刚创建的模板在“资源”面板中,点击面板下方新建模板按钮图标,也可创建一个新的空白模板3.将已
5、有的网页设置为模板方法如下:将设置好的网页,执行菜单命令“文件/另存为模板”,弹出“别存为模板”对话框,在该对话框中输入模板名即可。,编 辑 模 板,1.概述 模板内容的编辑与网页文档的编辑一样,可以使用Dreamweaver 8中提供的各种工具与命令。不同之处是模板有可编辑区域与锁定区域之分。锁定区域是那些不可编辑的部分,通常是网页中的固定不变元素或区域,如网站LOGO、版权信息等所有具有相同特征的元素对象。与之相反,可编辑区域是指经常变动的元素或区域。在编辑模板时,所有的区域都是可以编辑的,但是在利用模板编辑网页时,锁定区域是不可编辑的。2.创建可编辑区域 模板生成之后,还需要创建其可编辑
6、区域,以便以后为不同的网页编辑不同内容。具体方法如下: 将光标置于需要创建可编辑区域的位置或选中希望创建可编辑区域的对象,执行菜单命令“插入/模板对象/可编辑区域”,弹出“新建可编辑区域”对话框,在“文件”文本框中输入可编辑区域的名称即可。,编 辑 模 板,3.创建重复区域(1).概述 重复区域是指在基于模板的文档中添加所选区域的多个拷贝。可以使用重重复区域控制在页面中重复的区域布局或重复区域行。 重复区域可以根据需要在基于模板的页面中的拷贝任意次数的模板部分。重复区域通常用于表格,但是也可以为其他页面元素定义重复区域。重复区域,若要使重复区域中的内容进行编辑,则必须在重复区域内插入可编辑区辑
7、。(2).创建方法方法如下:选中要创建重复区域的对象,执行菜单命令“插入/模板对象/重复区域”,弹出“新建重复区域”对话框,在“名称”文本框中输入重复区域的名称即可。,编 辑 模 板,4.创建重复表格(1).创建方法 使用重复表格可以定义包括表格格式的可编辑区域和重复区域,还可以定义表格属性并设置哪些表格的单元格可以进行编辑。 方法如下: 将光标定位到希望插入重复表格的位置,执行菜单“插入/模板对象/重复表格”(2).属性参数设置属性参数设置如下:“行数”和“列数”:用来确定表格具有的行或列的数目单元格边距:用来确定单元格内容和单元格边框之间的像素数单元格间距:用来确定相邻的表格单元格之间的像
8、素数,编 辑 模 板,宽度:是以像素为单位或按占浏览器窗口宽度的百分比指定表格的宽度边框:是指定表格边框的宽度(以像素为单位)重复表格行:是指定表格中的哪些行包括在重复区域中起始行:将输入的行号设置为包括在重复区域中的第一行结束行:将输入的行号设置为包括在重复区域中的最后一行区域名称:为重复区域设置惟一的名称,编 辑 模 板,5. 利用模板创建网页利用模板创建网页有两种方法:执行菜单命令“文件/新建”,弹出“新建文档”对话框,单击其中的“模板”选项,从打开的“从模板创建”对话框中选中自己已创建的模板,单击“创建”即可注:模板区域(锁定区域)的边框呈黄色,其中的元素已经固定,不能对其进行修改,而
9、可编辑区域的边框呈蓝色,可以进行修改执行菜单命令“窗口/资源”(F11),打开“资源”面板,在左边分类中,选中“模板”按钮,面板右侧显示站点中所有模板,选中希望套用的模板,用鼠标拖曳到当前网页即可实现利用模板创建网页,编 辑 模 板,6.从文档中分享模板若要更改基于模板的文档的锁定区域,必须将该文档从模板分离。将文档分离之后,整个文档都将变成可编辑的。方法如下:执行菜单命令“修改/模板/从模板中分离”,即实现当前网页文档从模板中分离出来注:文档被从模板分离,所有模板代码都被删除7.更新模板“更新页面”对话框中参数设置: 在“查看”下拉列表中选择“整个站点”选项,在其右边的下拉列表中框中选择站点
10、名称,可以将所选站点中的所有页面更新到相应的已更新的模板,若在“查看”下拉列表框中选择“文件使用”选项,并从其右边的下拉列表框中选择模板名称,则会更新当前站点中使用所选模板的所有页面,编 辑 模 板,8.管理模板 使用“资源”面板的“模板”类别可以管理现有模板,包括重命名模板文件和删除模板文件。(1).重命名模板打开“资源”面板,选择面板左侧的“模板”类别两次单击模板的名称以便使文本可选,然后输入一个新的名称注:模板生效后,Dreamweaver 8会提示更新应用模板的网页文件(2).删除模板打开“资源”面板,选择面板左侧的“模板”类别单击面板底部的“删除”按钮即可注:一旦删除模板文件,则无法
11、对其进行检索,该模板文件将被从站点中删除,基于已删除模板的文档不会与此模板分离,它们保留该模板文件在被删除前所具有的结构和可编辑区域,使 用 库 项 目,1.概述 库是一种用来存储网站中常出现或重复使用的页面元素,这些元素称为库项目。Dreamweaver 8将库项目存储在每个站点的本地根文件夹内的Library文件夹中,当需要这些信息时,直接插入该项目即可,而且使用库比模板具有更大的灵活性。 对于链接项(如图像),库只存储对该项的引用。原始文件必须保留在指定的位置,才能使库项目正常工作。2.创建库项目 在Dreamweaver 中,用户可以使用网页中“”部分中的任意元素创建库项目。这些元素包
12、括文本、图像、表格、插件、导航条等。,使 用 库 项 目,创建库项目的方法有两种:(1).方法一:执行菜单命令“文件/新建”命令,弹出“新建文档”对话框,在该对话框中单击”常规“选项,在”基本页“列表框中选择”库项目“选项单击“创建”按钮,创建一个空白的库项目注:库项目操作像编辑网页一样,可以任意添加元素,然后保存即可(2). 方法二:打开“资源”面板(F11),选择面板左侧的“库”类别单击“资源”面板底部的“新建库项目”按钮,一个新的、无标题的库项目将被添加到面板中的列表,使 用 库 项 目,3.插入库项目方法如下:将光标定位到希望插入库项目的位置在“资源”面板中,选择左侧的“库”类别执行下
13、列操作之一:将一个库项目从“资源”面板拖到“文档”窗口中选择一个库项目,然后单击面板底部的“插入”按钮,使 用 库 项 目,4.设置库项目属性属性参数设置如下:Src: 显示库项目源文件的文件名和位置,此选项不可编辑打开:打开库项目的源文件进行编辑。这等同于在“资源”面板中选择项目并单击“编辑”按钮从源文件中分离:用于断开所选库项目及其源文件之间的链接。分离项目后,可以在文档中对进行编辑,但它不再是库项目并且不能再更改库项目时更新重新创建:用于当前选定内容改写原始库项目。使用此选项可以在丢失或意外删除原始库项目时重新创建库项目,使 用 库 项 目,5.修改和更新站点只更新使用该库的当前文档:修改/库/更新当前页面更新整个网站上使用该库的文档:修改/库/更新页面,