模板制作示例

作者:动易网络 来源:动易网络 点击数: 更新时间:2006年01月04日

制作流程

1.在制作模板前,您先需要在Photoshop、Fireworks等设计软件中制作网页效果图。然后利用这些软件的导出成Web格式文件功能,将效果图输出成Web文件和图片文件夹。
2.在Dreamweaver等网页设计软件中修改Web文件,将需要显示相关内容的地方修改或插入相应的的标签。
3.将图片文件夹上传至网站的目录中,同时添加或修改相关类型的版式模板,将Web文件的源代码拷入模板中并保存。将添加或修改的模板设置成默认模板。如果您开启了生成HTML功能,重新生成相关页面,刷新前台页面即可看到新模板的效果。

网页设计分析

网站首页模板一般包括以下几方面的内容:


·浏览器Title中显示的网站标题(A)
·显示网站的Logo图片(B)和Banner或广告信息(C)
·频道分类内容(D)和栏目分类内容(E)
·用户登录(F)、滚动公告(G)和当前日期显示(H)
·管理链接(I)、版权信息(J)和友情链接信息显示(K)
·站内幻灯片效果图片文章、图片文章(L)和文章标题信息(M)
·站内图片等功能频道的信息(N)及其他信息显示
您只要在设计的WEB文件中插入系统提供的相应的标签,并将代码拷入相应的模板中即可。

插入系统标签

以下说明均以Dreamweaver(以下简称DW)网页设计软件为示例。在进行下面的操作前,请先安装动易DW标签插件。本插件的安装与使用请参阅前节“使用动易DW标签插件”。

>>插入网站标题标签

1.在DW软件中打开已输出的Web文件,在“文档”工具栏中,单击“显示代码视图和设计视图”按钮,显示代码视图和设计视图。
在代码视图区中选择间的标题名:


2.插入标签:
在菜单中依次选择“插入(I)”->“动易标签(PowerEasy)”-> “动易通用标签”->“通用普通标签”,出现“网站通用普通标签”窗口:

3.在出现的窗口中选择“显示网站标题”选项后,单击“确定”按钮,在间插入系统显示网站标题的标签“{$PageTitle}”:


>>插入网站Logo和Banner标签

1.在DW的设计视图中,用鼠标点选Logo图片,在键盘中按“Del”键以删除Logo图片。
2.在菜单中依次选择“插入(I)”->“动易标签(PowerEasy)”->“动易通用标签”->“通用函数标签”->“显示网站Logo”,在弹出的Logo标签设置窗口中设置图片的宽度与高度,单位为像素(px)。设置完成后单击“确定”按钮:

3.在此时原来LOGO图片处插入“{$ShowLogo(180,60)}”标签:


4.同理,将Banner图片删除,在菜单中选择“通用函数标签”中的“显示网站Banner”,设置Banner图片的宽度与高度后单击“确定”按钮,插入Banner标签“{$ShowBanner(486,60)}”:

!如果有需要,以同样的做法可插入其他系统标签。在进行相关操作后请按保存(Ctrl+S)所作的修改。

33444
本篇文章的Tags:    模板  
如果以上内容未能解决您的问题,欢迎您到我们的讨论区发帖寻求帮助,我们的工作人员会热情为您解答。