网站模板制作培训教程.docx

网 站 模 板 制 作 教 程
为了满足广大论坛会员的要求,我站组织人员编写了此教程,方便会员根据自己的爱好制作模板。如果有不足之处敬请原谅,如果你有好的建议,希望你能联系我们。
网站模板主要有三大部分组成。１、网站头部（top） 2\网站身体（left和index）
3\网站底部（foot）。根据我站制作摸板的基本流程对网站的三大部分作如下讲解：
　　　　　在开始前我先做一些声明，因为本站用到的一些文件名是固定的，所以您在制作模板是应严格按照我站的命名，否则会对您的使用带来不便。
一、 TOP的制作
１、 新建一个文档如图　

２、 当进入后我们要删除一些代码，只保留第５句代码

（<meta http-equiv="Content-Type" content="text/html; charset=gb2312">）
这些代码及每个文件的功用会在后面作介绍，在这里先不讲
３、 把您所要用到的所有图片保存到同一个文件夹中命名为images
４、 排版几行几列可根据自己的爱好进行，但表格宽度定为776px.并
进行保存，文件名为top_cn.asp 这里以这个模板为例

５、在代码区键入一些代码，
<!--#include file="conn.asp" -->
<!--#include file="ad.asp"-->
<title><%=Jsitename%></title>
<script src="count/count.asp?view=admin&fy=2"></script>
<%=Script%>
６、加入网站标志，在代码区键入<!--#include file="more_top_logo.asp"-->
　　位置放在<IMG
src="images/top_cn.png">的上面如图

　　这时当你点击设计区你会发现一些ASP联接已经自动生成
如图

７、进行简体，繁体及英语三个版本的联接
简体 language.asp?lan=cn&info=web
繁体 language.asp?lan=big&info=web
英语 language.asp?lan=en&info=web
如图

如果需要时间显示您也可以根据您的排版进行时间设置,代码为
<!--#include file="time_cn.asp"-->
8键入简体首页代码
<!--#include file="more_top_menu_cn.asp"-->
如图

到这步为止ＴＯＰ就算完成了，你这是可以检查一下是否有遗漏的地方。
下面我们开始制作LEFT
再开始前我相信大家心里已经有了明确的排版.在这里我就讲一下数据库调用的一些代码.
１、 会员登陆框
<!--#include file="more_left_sidejmemo1_cn.asp"-->
<!--#include file="Member_cn.asp"-->
<!--#include file="more_left_sidejmemo2_cn.asp"-->
如图 您可以看到8，18，25行处的代码

２、 最新动态框
<!--#include file="News_cn.asp" -->
<!--#include file="more_left_sidejmemo3_cn.asp"-->
<%If Votehidden="1" then%><script src="showvote.asp"></script><%End If%>
<!--#include file="more_left_sidejmemo4_cn.asp"-->
如图 39、41、53、55处的代码
３、 友情链接框
<!--#include file="FriendLink_cn.asp" -->
<!--#include file="more_left_sidejmemo5_cn.asp"-->
如图 78、83处的代码
到这步为止 LEFT制作完成了
让我们看一下设计区的现在的样子是怎样的
如图

好了下面我们来做INDEX
在Index里包括了Foot,好下面我们开始，和上面一样排版可根据您
自己的喜欢做，但有些代码我们是规定的，这点会在后面我会讲到。
下面让我们抓紧时间时间开始吧！
1、<!--#include file="top_cn.asp" -->
2、<!--#include file="css/style.css" -->
3、<!--#include file="left_cn.asp" -->
4、<!--#include file="Content_CnIndex.asp" -->
5、<!--#include file="foot_cn.asp" -->
如图代码区
以上是Index的所有代码，再看一下设计区的
如图
好了到这步为止摸板的三大块基本完成了，但我们下边要进行
预览一下如图
基本上没问题了，下面我们要进行比较烦琐的操作你做好准备
了吗？
１、 把刚才做好的top打开，并另存为top_big.asp
２、 把所有的_cn替换成_big
３、 把Jsitename替换成Fsitename
４、 把top_big.asp另存为top_en.asp
５、 把所有的_big替换成_en
６、 把Fsitename替换成Esitename
聪明的朋友已经能够猜到因为我们要做简、繁、英
三个版本。好了top到这里就做完了。
接下来我们来做Left 步骤和上面差不多
１、 把left_cn.asp另存为left_big.asp
２、 把_cn全部替换成_big
３、 把sidejmemo全部替换成sidefmemo
４、 把left_big.asp另存为left_en.asp
５、 把_big全部替换成_en
６、 把sidefmemo全部替换成sideememo
这样Left做完了
接着我们做Index
１、 把index_cn.asp另存为index_big.asp
２、 把_cn 替换成_big
３、 把index_big.asp另存为index_en.asp
４、 把_big替换成_en
是不是挺简单，呵呵！别高兴的太早了，接下来可
就繁了。
1、把index_cn.asp打开另存为Download_cn.asp
2、把<!--#include file="Content_CnIndex.asp" -->替换成
<!--#include file="more_Download_cn.asp"-->
４、 把Download_cn.asp另存为Form_cn.asp
５、 把<!--#include file="more_Download_cn.asp"-->替换成
<!--#include file="more_form_cn.asp"-->
６、 把Form_cn.asp另存为login_cn.asp
７、 把<!--#include file="more_form_cn.asp"-->替换成
<!--#include file="more_login_cn.asp"-->
８、 把login_cn.asp另存为Order_cn.asp
９、 把<!--#include file="more_login_cn.asp"-->替换成
<!--#include file="more_Order_cn.asp
到这里为止我想大家和我一样看出规律了吧！好那下面
我就不在多说了，我就把另外的几个文件名告诉大家，按照
上面的方法继续往下做就行了。
Pic_cn.asp reg_cn.asp Show_FriendLink_cn.asp
Show_Pic_cn.asp Show_Text_cn.asp
single_cn.asp Text_cn.asp
以上是cn版本，繁体、英语做起来和前面的一样
只是把cn换成big和en就行了。
好了下面我们要进行最后的收尾工作了（：
完成上面所有工作后在我们的文件夹中有42个文件，看
一下您有没有少做啊！
接下来我们要把三个top_cn.png top_big.png top_en.png
图片放入source_img文件夹中
现在在您的文件夹中应该有两个文件夹images和source_img
还有刚才做的42个文件，把他们进行上传就可以了。
到此为止您的精美的摸板也就大公告成了。
呵呵！

制作人：华仔
2005年1月
易建计算机科技有限公司版权所有