网站模板专题模板制作教程doc.docx
- 文档编号:20141259
- 上传时间:2023-04-25
- 格式:DOCX
- 页数:17
- 大小:234.04KB
网站模板专题模板制作教程doc.docx
《网站模板专题模板制作教程doc.docx》由会员分享,可在线阅读,更多相关《网站模板专题模板制作教程doc.docx(17页珍藏版)》请在冰豆网上搜索。
网站模板专题模板制作教程doc
系统模板制作教程
V1.0
目录
1.模板目录结构3
2.模板网页名称命名规范3
3.模板标签介绍4
3.1标签概述4
4.常用标签使用说明5
4.1ChnlList标签使用说明5
4.2内容页常用标签使用说明6
4.4Include标签使用说明10
4.5Position标签使用说明11
4.6VoteTopic标签使用说明11
4.7其它标签12
5常用模板变量12
6.专题模板制作12
6.1专题页模板命名规范12
6.2专题模板制作步骤12
7.网站模板上传13
第一步:
将制作好的模板打包13
第二步:
将模板上传至服务器13
1.模板目录结构
上图为农机局模板目录结构,最上层代表模板名称,有字母组成,子目录有2个,分别是res、tpl:
1)、Res目录:
存放网页资源,如图片文件、样式表文件、脚本文件等。
注:
res目录下images用来存放各种资源文件。
thumb.jpg为模板的缩略图文件。
2)、Tpl目录:
存放网页文件,如下图。
注:
模板个文件夹及文件名字必须按以上规范制作,否则将无法使用。
2.模板网页名称命名规范
模板所需的页面全部放在”模板名/tpl”文件夹下,模板的网页命名规范规范如下。
alone.html:
独立页面模板,适用于网站介绍、领导介绍等类型栏目。
channel.html:
栏目列表页面模板。
content.html:
文章显示页面模板
footer.html:
网页底部页面模板
header.html:
网页头部页面模板
index.html:
首页模板
sys_Search.html:
搜索页面模板
sys_VoteResult.html:
投票结果页面模板
tag_VoteTopic.html:
投票页面模板
video.html:
视频列表页面模板
video_content.html:
视频显示页面模板。
以上模板为建立网站所需基本模板,用户可根据需要对模板进行扩展,如网站有多个频道,各个频道列表显示页面不同,可建立channel_频道一.html、channel_频道二html等频道列表页面,建立规则为“channel_频道一.html”,红色部分不变,黑色部分名字自定义,其它模板扩展办法同理。
3.模板标签介绍
标签为模板的灵魂,用来调用后台数据数据并显示。
3.1标签概述
调用标签的三种代码样式如下:
A、${标签名称}
B、<@cms.标签名称属性='值'/>
C、<@cms.标签名称属性='值';标签别名>自定义样式模板@cms.标签名称>
例如:
a:
${web.name}标签用于调用网站名称
b:
<@cms.ArtiListchnlId=''count='10'sysContent='1-1'/>标签用于调用10篇文章的列表
c:
<@cms.ChnlListid=''inner='1';c>
@cms.ChnlList>标签用于调用栏目列表,可用于网站导航条。
注意:
abc实例是与上面ABC三种形式相对应的。
大家可以逐个测试,举一反三。
4.常用标签使用说明
4.1ChnlList标签使用说明
在页面中获取栏目列表的时候我们要用到<@cms.ChnlList/>标签,本标签不仅可以单独使用,还可以配合其它标签使用,达到更加丰富的效果。
本节教程都是在新建的演示空白首页模板中作演示。
一、标签原型说明
【标签名】:
<@cms.ChnlList属性='值'/>
【作 用】:
显示各栏目列表
【参 数】:
id:
父栏目ID。
(默认为空:
自动获取当前栏目ID)
orderBy:
排序方式。
【0:
优先级升序;1:
优先级降序;2:
点击次数升序;3:
点击次数降序】(默认0)
isDisplay:
是否只获取显示的栏目。
【0:
获取所有;1:
只获取显示的栏目】(默认1)
hasContent:
是否只获取可以有内容的栏目。
【0:
获取所有;1:
只获取可以有内容的栏目】(默认0)
linkClass:
链接class
linkTarget:
链接打开方式。
【0:
当前窗口;1:
新窗口】(默认0)
style:
标签内部样式。
如果指定sysContent或userContent,则该项无效。
【1:
普通链接列表;】(默认1)
sysTpl:
使用系统模板。
【0:
不使用;1:
使用】(默认1)
sysContent:
系统内容样式。
(默认0)
userContent:
自定义内容样式。
如果指定了系统内容样式,则该项无效。
(默认0)
sysPage:
系统分页样式。
【0:
不分页;1:
样式一;2:
样式二】(默认0)
userPage:
自定义分页样式。
如果指定了系统分页样式,则该项无效。
【0:
不分页;1:
样式一;2:
样式二】(默认0)
showTop:
栏目是否在导航栏出现,【0:
不出现;1:
出现】默认0
【备 注】:
在代码模式下编辑,各属性值必须使用单引号,属性排列顺序不分先后。
二、标签的使用范围
我们在使用任何标签的之前,都必须明确其使用的范围,否则可能无法正常使用该标签。
<@cms.ChnlList/>标签的使用范围是:
首页模板,栏目页模板,即:
index_××.html模板、channel_××.html模板。
三、调试标签了解其使用方法
1、单独标签调用示例:
<@cms.ChnlList/>
2、自定义标签调用示例:
<@cms.ChnlListid=''inner='1';c,i>
#if>
@cms.ChnlList>
3、配合其它标签嵌套调用示例:
<@cms.ChnlListid=''sysType='article'hasContent='1'inner='1';c>
<@cms.ArtiListchnlId=c.idsysContent='1-1'titLen='20'count='6'/>
@cms.ChnlList>
4.2内容页常用标签使用说明
一、标签原型说明
【文章导航】:
<@cms.Position/>
【文章标题】:
${arti.title}
【简短标题】:
${arti.shortTitle}
【文章作者】:
${arti.author}
【发布日期】:
${arti.releaseDate}
【查看次数】:
${arti.visitTotal}
【文章来源】:
${arti.origin}
【文章摘要】:
${arti.description}
【文章内容】:
<@cms.ArtiContent/>
【内容分页】:
<@cms.SysPagestyle='2'/>
二、标签的使用范围
主要使用范围是内容页模板,即对应content_××.html模板。
4.3文章列表ArtiList标签
比如文章图文列表、文字或图片跑马灯、文字或图片上下循环滚动等等。
一、 标签原型说明
【标签名】:
<@cms.ArtiList属性='值'/>
【作 用】:
获取文章列表数据
【参 数】:
属性名称
属性说明
默认值
可选值
chnlId
栏目ID,栏目页中可不设置,系统会自动获取当前栏目ID
当前栏目ID
空:
显示全站文章列表;
栏目ID:
指定栏目文章列表
attr
文章属性ID
空
后台自定义
sysContent
列表显示方式
1-1
1-1:
普通标题列表显示;
1-2:
图文列表显示;
3-1:
焦点图显示;
2-1:
标题列表翻滚显示
2-2:
图文列表翻滚显示
orderBy
排序方式
0
0:
发布时间降序;
1:
发布时间升序;
2:
点击次数降序;
3:
点击次数升序
recommend
是否推荐
0
0:
所有文章
1:
推荐文章
titLen
标题长度
20
自定义
target
链接打开目标
0
0:
原窗口打开
1:
新窗口打开
headMark
文章标题图标
0
0:
无图标
1:
黑色小圆点
2:
红色小圆点
3:
蓝色单箭头
4:
蓝色双箭头
自定义图标:
填写图标路径
lineHeight
文章列表每行的行高
空
自定义
bottomLine
每行标题下是否带分隔线
0
0:
无分隔线
1:
有分隔线
ctgForm
文章类别形式
0
0:
不显示文章类别;
1:
显示栏目类别;
2:
显示站点名称
ctgClass
文章类别的css-class
空
自定义css样式的class名称
dateFormat
文章发布日期显示格式
0
0:
不显示日期
1:
”年-月-日时-分-秒”格式
2:
”年-月-日”格式
3:
”月-日时-分”格式
4:
”月-日”格式
datePosition
日期排列位置
1
1:
紧跟标题之后
2:
右对齐
3:
左对齐
isPage
是否显示分页
0
0:
否;1:
是
count
每页列表显示数量
20
自定义
仅当sysContent=2(图文列表)时,以下标签属性才有效
picWidth
按百分比显示图片宽度
25(即每个图片占总宽度的25%,每行可放四张图片)
自定义
picHeight
每行图片显示高度
110
自定义
仅当sysContent=3(焦点图)时,以下标签属性才有效
flashWidth
焦点图宽度
296(px)
自定义
flashHeight
焦点图总高度
200(px)
自定义
textHeight
焦点图文本高度
20(px)
自定义
仅当sysContent=4或5(文字、图片滚动)时,以下标签属性才有效
rollDisplayHeight
显示区高度
28
自定义
rollLineHeight
行高
28
自定义
rollCols
列数(一行中包含几列)
1
自定义
rollSpeed
滚动速度,值越小越快,最小为1
1
自定义
isSleep
是否停顿
1
0:
不停顿;
1:
停顿
rollSleepTime
停顿时间,值越大停顿越久
50
自定义
rollCount
一次滚动的行数
1
自定义
rollSpan
一次滚动的像素
1
自定义
其它高级标签属性(用于用户个性设置)
searchKey
在标题、tags和描述中搜索指定关键字的文章列表,用于搜索页模板
空
自定义关键字
style
标签内部样式,如果指定sysContent或userContent,则该项无效
1
1:
普通列表
sysTpl
指定系统模板
1
自定义
sysContent
系统内容样式
0
自定义
userContent
用户内容样式,当sysContent=1时有效
空
自定义
sysPage
系统分页样式
0
自定义
userPage
用户分页样式,当sysPage=1时有效
空
自定义
upSolution
指定其它模板方案样式
空
自定义
upWebRes
指定其它站点样式
空
自定义
pageClass
分页栏css样式的class名称
空
自定义
pageStyle
分页栏css自定义style样式
空
自定义
custom
用户扩展属性集合
空
自定义
【示 例】:
<@cms.ArtiListchnlId=''count='5'sysContent='1-1'titLen='25'lineHeight='1'dateFormat='4'datePosition='2'headMark='2'target='1'/>
二、标签使用范围
【ArtiList标签】的使用范围是:
首页模板,栏目页模板,内容页模板,即对应index_识别ID.html模板、channel_识别ID.html模板、content_识别ID.html模板
三、调试标签了解其使用方法
(1).文章列表
<@cms.ArtiListchnlId=''count='5'sysContent='1'titLen='25'lineHeight='1'dateFormat='4'datePosition='2'headMark='2'target='1'/>
(2).图文列表
<@cms.ArtiListchnlId=''attr='5'count='5'sysContent='2'titLen='25'target='1'picWidth='25'picHeight='110'/>
4.4Include标签使用说明
我们可以将页面中经常要引用的公共部分(比如页头和页脚)独立开来,单独存放在一个页面中。
这样做的好处就是可以在各个需要用到该部分的页面中用一个简单的包含语句就能把它引入进来,大大简化了工作量。
所以【Include标签】的使用率很高,相当实用,这是我们在模板制作过程中必须熟练掌握的一个基础标签.
一、标签原型说明
【标签名】:
<@cms.Include属性='值'/>
【作 用】:
包含公用页面(如页头,页脚)
【参 数】:
name:
包含模板的文件名
solution:
模板方案名
【示 例】:
包含页头:
<@cms.Includename='head.html'solution='default'/>
【备 注】:
调用此标签前必须先建立相应的包含模板
二、标签使用范围
【Include标签】的使用范围是:
首页模板,栏目页模板,内容页模板,即对应index_××.html模板、channel_××.html模板、content_××.html模板
三、调试标签实例:
//www.w3.org/1999/xhtml">
<@cms.Includename='head.html'/>