TRS幻灯片模板2008

Download Report

Transcript TRS幻灯片模板2008 

TRS WCM V6.0
模板制作
北京拓尔思信息技术股份有限公司
www.trs.com.cn
内容提要
•
•
•
•
一、TRSWCM概述、模板的作用概述
二、TRSWCM模板置标
三、WCM内模板管理和模板编辑方法
四、Dreamweaver模板编辑插件和模板制作
方法
• 五、常见应用示例模板代码
www.trs.com.cn
第一章：概述WCM及模板
www.trs.com.cn
WCM工作原理
数据库服务器，比如
Oracle，SQLServer等
存储网站数据。
内容协作平台
服务器(WCM)
R
网站管理、维护人
员通过浏览器访问
内容管理平台，进
行系统和数据的管
理
www.trs.com.cn
Web Server
网站的最终
用户
网站建设流程
Web Content Management，WCM
1，创建站点
站点
结构
规划
内容；
风格；
栏目；
页面；
2，创建频道（多层频道树）
创建频道
3，创建模板(包括概览模
板、细览模板），并使用
到频道上
4，网站数据采集、编审
5，网站发布
www.trs.com.cn
模板
• 模板的作用
– 负责页面的显示风格和显示内容
• 模板的组成
– 模板由HTML置标和TRS置标组成。（含有TRS置标的
HTML文件）
– HTML决定页面风格；TRS置标决定页面显示内容；
• 模板的类型
– 概览模板：主页模板和各栏目的概览模板
– 细览模板：各栏目的细览模板
– 嵌套模板：可嵌套的通用模板
www.trs.com.cn
模板发布原理－数据＋模板
单篇发布
频道发布
www.trs.com.cn
模板和页面
频道文档列表
www.trs.com.cn
频道数据、模板、页面的关系
频道
频道
频道
频道
发布
频道
访问用户
频道
Html页
模板
频道
www.trs.com.cn
第二章：TRSWCM模板置标
www.trs.com.cn
置标种类
•
•
•
•
TRS_DOCUMENTS: 文档列表
TRS_RELNEWS: 相关新闻列表
TRS_CHANNELS: 频道列表
TRS_RECORD： 分组显示






TRS_DOCUMENT: 文档详细信息（标题、作者、正文、图片…）
TRS_CHANNEL: 频道详细信息
TRS_APPENDIX: 文档附件
TRS_CURPAGE: 当前位置
TRS_REPLACE: 替换内容
细览置标
TRS_DATETIME: 发布时间
 TRS_TEMPLATE： 嵌套模板
www.trs.com.cn
概览置标
•
•
•
•
•
•
TRS_ROLLDOCUMENTS：滚动新闻列表
TRS_NEWICON：显示最新新闻标志
TRS_CONDDITION：条件置标
TRS_ECHO：在当前置标位置输出指定内容
TRS_VARIABLE：变量声明
TRS_ENUM：声明变量枚举值
www.trs.com.cn
特殊应用置标
频道列表：
每个频道，都需配置概
览和细览模板才允许被
发布。
www.trs.com.cn
TRS置标说明
TRS置标说明
置标的主要作用是控制数据在模板中的表现形式，将数
据与表现分开。主要思路是TRS置标处理数据的内容，存放的位
置以及如何存放等，数据的表现形式则由标准的html语言描述，
例如：
<FONT COLOR=RED>
<TRS_DOCUMENT FIELD=”DOCTITLE”>这里放置文档标题
</TRS_DOCUMENT>
</FONT>
其中：红色是TRS置标，蓝色部分是标准的HTML置标。TRS置标
表明要在该位置放置字段名为“标题”的字段内容。
www.trs.com.cn
第三章：模板管理和编辑
www.trs.com.cn
WCM内模板管理
选站点或
栏目
模板列表，
可分类显示
模板操作
配置模板。
选模板
分类
www.trs.com.cn
需发布的站点、
栏目必须配置模
板和存放位置
新建模板
输入名称，
选择类型
（必须）
利用置标向导生成置标代码，粘帖到
鼠标位置
www.trs.com.cn
导出、导入模板
导出成ZIP文件。将模板html文件、图
片、js等同步导出。
支持导入html、zip等格式。
如模板中有图片需要导入，需将模板
html文件和图片css等文件夹一起打
包成zip文件，然后导入。
www.trs.com.cn
模板校验语法错误（1）
模板保存时，WCM将自动校验置标书写语法，
如有错误，将显示提示。
www.trs.com.cn
模板校验语法错误（2）
在模板列表界面，可批量校
验选中的模板
www.trs.com.cn
同步模板附件
• 模板图片存放在WCM服务器目录/wcmdata/template/里面。
当站点或栏目预览或发布后，模板图片、js文件、css文件
等将自动分发到/wcmdata/preview或/wcmdata/pub/下面。
• 同步模板附件，由手工确保这种附件的分发。
www.trs.com.cn
模板配置到栏目
• 选择栏目后，可以在栏目信息页面直接配置。
www.trs.com.cn
第四章：Dreamweaver模板插件、模板制作
www.trs.com.cn
插件登录WCM
• 登录用户：同登录WCM的用户和密码
• 服务器地址：
http://192.9.200.200:8080/wcm/services/trs:template
servicefacade
注意：需要将其中的192.9.200.200:8080/wcm 替换成实际使用的WCM
访问地址
点此按钮，进行离线编辑
www.trs.com.cn
制作模板过程
1,设置本地站点和WCM站点对应关系
2,创建、编辑模板
3,上传模板
www.trs.com.cn
第五章：常见应用示例模板
www.trs.com.cn
图片新闻-图片切换显示
• 替换其中置标的频道名称即可： <TRS_DOCUMENTS NUM="5" ID="图片">
<table>
<script language='JavaScript'>
var imgUrl=new Array();
var imgLink=new Array();
var imgTz=new Array();
var adNum=0;
var kk = 1;
var filepath_liucp="";
<TRS_DOCUMENTS NUM="5" ID="图片">
filepath_liucp='<TRS_recpath></trs_recpath>';
filepath_liucp = filepath_liucp.substring(0,filepath_liucp.lastIndexOf("/")+1);
imgUrl[kk] =filepath_liucp + '<TRS_APPENDIX INDEX="0" MODE="PIC" FIELD="APPFILE"></TRS_APPENDIX>';
imgLink[kk] = '<trs_recpath></trs_recpath>';
imgTz[kk] = '<a href="<TRS_recpath></trs_recpath>" target="_blank"><font color=#CC0000><TRS_DOCUMENT
AUTOLINK="false" FIELD="doctitle" NUM="42"></TRS_DOCUMENT></font></a>';
kk++;
</TRS_DOCUMENTS>
kk--;
var imgPre=new Array();
var j=0;
for (i=1;i<=5;i++) {
if( (imgUrl[i]!="") && (imgLink[i]!="") ) {
j++;
} else {
break;
}
}
function playTran(){
if (document.all)
imgInit.filters.revealTrans.play();
}
www.trs.com.cn
图片新闻-图片切换显示
var key=0;
function nextAd(){
if(adNum<j)adNum++ ;
else adNum=1;
if( key==0 ){
key=1;
} else
if (document.all){
imgInit.filters.revealTrans.Transition=6;
/*
transition :
可选项。整数值(Integer)。设置或检索转换所使用的方式。
0 :
矩形收缩转换。
1 :
矩形扩张转换。
2 :
圆形收缩转换。
3 :
圆形扩张转换。
4 :
向上擦除。
5 :
向下擦除。
6 :
向右擦除。
7 :
向左擦除。
8 :
9 :
10 :
纵向百叶窗转换。
横向百叶窗转换。
国际象棋棋盘横向转换。
11 :
国际象棋棋盘纵向转换。
随机杂点干扰转换。
左右关门效果转换。
左右开门效果转换。
上下关门效果转换。
上下开门效果转换。
从右上角到左下角的锯齿边覆盖效果转换。
从右下角到左上角的锯齿边覆盖效果转换。
从左上角到右下角的锯齿边覆盖效果转换。
从左下角到右上角的锯齿边覆盖效果转换。
随机横线条转换。
随机竖线条转换。
随机使用上面可能的值转换。
12 :
13 :
14 :
15 :
16 :
17 :
18 :
19 :
20 :
21 :
22 :
23 :
*/
imgInit.filters.revealTrans.apply();
}
playTran();
}
document.images.imgInit.src=imgUrl[adNum];
document.getElementById('tpxw').innerHTML='<a href="' + imgLink[adNum] + '" target="_blank">' +
imgTz[adNum] + '</a>';
theTimer=setTimeout("nextAd()", 6000); //转换间隔时间
www.trs.com.cn
图片新闻-图片切换显示
function goUrl(){
jumpUrl=imgLink[adNum];
jumpTarget='_blank';
if (jumpUrl != ''){
if (jumpTarget != '')
window.open(jumpUrl,jumpTarget);
else
location.href=jumpUrl;
}
}
</script>
<tr class="14txt22">
<td bgcolor="#F0F0E8"><a href="javascript:goUrl()"><img style='FILTER:
revealTrans(duration=2,transition=1)' src='javascript:nextAd()' border='0' width='243'
height='168' class='img01' name='imgInit'></a></td>
</tr>
<tr>
<td class="14txt22"><center><font color="#CC0000"><span id='tpxw'>标题
</span></font></center></td>
</tr>
</table>
www.trs.com.cn
概览分页
• 代码：
内容显示：
<!--循环开始-->
<TRS_DOCUMENTS NUM="500" PAGESIZE="4" AUTOMORE="FALSE">
<table width="100%" height="20" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>·<TRS_DOCUMENT FIELD="DOCTITLE" EXTRA="class='10ptb'" TARGET="_blank"> 标题放于此处
</TRS_DOCUMENT><font style='color:#ADADAD'>[<TRS_DOCUMENT FIELD="DOCRELTIME" EXTRA="class='10ptb' style='color:#ADADAD'"
DATEFORMAT="yyyy/MM/dd"> 标题放于此处 </TRS_DOCUMENT>]</font></td>
</tr>
</table>
</TRS_DOCUMENTS>
<!--循环结束-->
分页脚本script：
<SCRIPT LANGUAGE="JavaScript">
//createPageHTML(${PAGE_COUNT}, ${PAGE_INDEX}, "${PAGE_NAME}", "${PAGE_EXT}");
var currentPage = ${PAGE_INDEX};//所在页从0开始
//var headPage = "${PAGE_NAME}"+"."+"${PAGE_EXT}";//首页
//var tailPage = "${PAGE_NAME}_" + (countPage-1) + ".${PAGE_EXT}"//尾页
var prevPage = currentPage-1//上一页
var nextPage = currentPage+1//下一页
var countPage = ${PAGE_COUNT}//共多少页
document.write("共"+countPage+"页&nbsp;&nbsp;");
//设置上一页代码
if(countPage>1&&currentPage!=0&&currentPage!=1)
document.write("<a href=\"${PAGE_NAME}.${PAGE_EXT}\">首页</a>&nbsp;<a href=\"${PAGE_NAME}"+"_" + prevPage +
"."+"${PAGE_EXT}\">上一页</a>&nbsp;");
else if(countPage>1&&currentPage!=0&&currentPage==1)
document.write("<a href=\"${PAGE_NAME}.${PAGE_EXT}\">首页</a>&nbsp;<a href=\"${PAGE_NAME}.${PAGE_EXT}\">上一页
</a>&nbsp;");
else
document.write("首页&nbsp;上一页&nbsp;");
www.trs.com.cn
概览分页
//循环
var num = 5;
for(var i=0+(currentPage-1-(currentPage-1)%num) ; i<=(num+(currentPage-1-(currentPage-1)%num))&&(i<countPage) ; i++){
if(currentPage==i)
document.write((i+1)+"&nbsp;");
else if(i==0){
document.write("<a href=\"${PAGE_NAME}"+"."+"${PAGE_EXT}\">"+1+"</a>&nbsp;");}
else
document.write("<a href=\"${PAGE_NAME}"+"_" + i + "."+"${PAGE_EXT}\">"+(i+1)+"</a>&nbsp;");
}
//设置下一页代码
if(countPage>1&&currentPage!=(countPage-1))
document.write("<a href=\"${PAGE_NAME}"+"_" + nextPage + "."+"${PAGE_EXT}\">下一页</a>&nbsp;<a href=\"${PAGE_NAME}_" +
(countPage-1) + ".${PAGE_EXT}\">尾页</a>&nbsp;");
else
document.write("下一页&nbsp;尾页&nbsp;");
//跳转页面
document.write("<font class='9ptb'>转到第<input type='text' id='num' value="+(currentPage+1)+" style='width:30px'>页"+
"&nbsp;<input type='submit' value='提交' onClick=javacript:toPage()></font>");
function toPage(){
var _num = document.getElementById("num").value;
var str = "${PAGE_NAME}"+"_"+(_num-1)+"."+"${PAGE_EXT}";
var url = location.href.substring(0,location.href.lastIndexOf("/")+1);
if(_num<=1||_num==null)
location.href = url+"${PAGE_NAME}"+"."+"${PAGE_EXT}";
else if(_num>countPage)
alert("本频道最多"+countPage+"页");
else
location.href = url+str;
}
</SCRIPT>
www.trs.com.cn
文章内容分页
• 文章内容分页需要两处设置：
– 1，采编文章时，在需要分页处插入分页符
– 2，细览模板中写入分页代码
www.trs.com.cn
文章内容分页
<SCRIPT LANGUAGE="JavaScript">
<!-function createPageHTML(_nPageCount, _nCurrIndex, _sPageName, _sPageExt){
if(_nPageCount == null || _nPageCount<=1){
return;
}
• 将以下代码拷贝到细览模板的需要放置分页页码
处：
var nCurrIndex = _nCurrIndex || 0;
if(nCurrIndex == 0)
document.write("1&nbsp;");
else
document.write("<a href=\""+_sPageName+"."+_sPageExt+"\">1</a>&nbsp;");
for(var i=1; i<_nPageCount; i++){
if(nCurrIndex == i)
document.write((i+1) + "&nbsp;");
else
document.write("<a href=\""+_sPageName+"_" + i +
"."+_sPageExt+"\">"+(i+1)+"</a>&nbsp;");
}
}
//WCM置标
createPageHTML(${PAGE_COUNT}, ${PAGE_INDEX}, "${PAGE_NAME}", "${PAGE_EXT}");
//-->
</SCRIPT>
www.trs.com.cn