在Dreamweaver 中应用模板

简介:

模板的作用:

一、有助于保持整个网站外观和风格的一致;

二、在模板中进行修改后,所有应用模板的页面都将自动更新。


// 在其.dwt 模板中

<!--  TemplateBeginEditable name="myName"  -->
    设置可编辑区域
<!--  TemplateEndEditable  -->

 

// 在页面中,声明应用模板的地址,以及区域等

复制代码
< HTML >
<!--  InstanceBegin template="/Templates/myTemplates.dwt" codeOutsideHTMLIsLocked="false"  -->
  
< HEAD >
  
  
</ BODY >
<!--  InstanceEnd  -->
</ HTML >
复制代码

 

// 在模板区域内,设置可编辑区域

<!--  InstanceBeginEditable name="myName"  -->
    放入可编辑区域的内容
<!--  InstanceEndEditable  -->

 

简单示例:

Demo

 


注意要点:

A  在创建模板时,必须慎重定义可编辑区域和不可编辑区域。

B  模板将自动保存在“Templates”文件夹中,该文件夹在站点的本地根文件夹下。

     1. 不能模板从“Templates”文件夹中移出;

     2. 不能将非模板文件放在“Templates”文件夹中;

     3. 不能将“Templates”文件夹从站点的本地根文件夹中移出。 


将现有文件保存为模板:

       1.打开要转变成模板的页面;

       2.选择“文件”->“另存为模板”,保存模板;


新建空白模板:

       1.选择“窗口”->“资源”命令(或按 F11键)。

       2.单击“资源”面板上的“模板”图标,显示“模板”面板。

       3.单击“模板”面板右下角的“新建模板”图标。

      默认情况下,整个模板都处于锁定状态。


添加可编辑区域:

       方法一:

               在“插入”栏->“常用”选项卡->“模板”图标->“可编辑区域”;

       方法二:

               在“插入”->“模板对象”->“可编辑区域”;

       方法三:

               按Ctrl+Alt+V 组合键;

       方法四:

               右键选中区域->“模板”->“新建可编辑区域”


删除可编辑区域:

          选中编辑区域,“修改”->“模板”->“删除模板标记”,该区域将被锁定,不可编辑。


修改编辑模板:

          选择“窗口”->“资源”->“模板”图标->选择要编辑的模板,然后双击,该模板将出现在“文档”窗口,此时即可编辑该模板。


对网页应用模板:

          1.打开要应用模板的文档(即:页面);

          2.选择“窗口”->“资源”->“模板”图标->选择要应用的模板;

          3.将模板从面板拖到页面窗口中(或单击“应用”按钮);

          4.在可编辑区域添加或编写数据;

注意: 如果文档中已经有内容,必须将现有内容移到模板的可编辑区域内,否则Dreamweaver将会删除这些内容!




本文转自钢钢博客园博客,原文链接:http://www.cnblogs.com/xugang/archive/2008/10/28/1321271.html,如需转载请自行联系原作者


相关文章
|
前端开发 JavaScript
|
移动开发 前端开发 JavaScript
Dreamweaver制作网页的步骤
Dreamweaver软件制作网页的步骤
189 0
Dreamweaver如何导入psd文件?
Dreamweaver如何导入psd文件?
289 0
|
数据可视化
dreamweaver中的代码怎样导入网站中?
dreamweaver中的代码怎样导入网站中?
133 0
|
开发框架 .NET 数据库
Dreamweaver网页设计与制作
网页设计与制作
192 0
|
JavaScript
dreamweaver能制作移动网页吗?
dreamweaver能制作移动网页吗?
99 0
|
前端开发 数据库
做动态网站用 Dreamweaver可以嘛?
做动态网站用DW可以嘛?
150 0
|
前端开发 JavaScript 开发工具
|
前端开发
《网站建设与网页设计从入门到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript》——3.4 编辑文本格式
本节书摘来自异步社区《网站建设与网页设计从入门到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript》一书中的第3章,第3.4节,作者:何新起 更多章节内容可以访问云栖社区“异步社区”公众号查看。
1810 0