AMS系统模版文件集

模版文件注意事项

模版文件中比较运算符种类：大于：> 、小于：< 、不等于：! 、等于：= 、 >=和 <= 均不合法
字段不够用，自定义字段来凑：$sExtField1.DATA$ 、$sExtField2.DATA$

模版标签参考

最常用

属性	模板便签
资讯标题	$sTitle.DATA$
正文内容	$sContent.DATA$
发布日期短格式（月/日）	$dtReleaseDate.DATA$
当前页链接	$infoPath.DATA$
主题图片-大图	$sInfoImageAddr.DATA$
当前频道名称	$sTypeName.DATA$
当前频道列表页	$typeIndexPath.DATA$
资讯ID	$iInfoId.DATA$

文章属性类

属性	模板便签
关键字	$sKeyWord.DATA$
对外作者	$sUserCreator.DATA$
资讯摘要	$sSubContent.DATA$
是否跳转	$sIsRedirect.DATA$
跳转地址	$sRedirectAddress.DATA$

标题属性类

属性	模板便签
标题[首页]颜色	$sTitleIndexColor.DATA$
标题[列表页]颜色	$sTitleListColor.DATA$
标题加粗（输出1）	$sTitleBold.DATA$
热门、最新图标（1：热门；2：最新）	$sTitleIcon.DATA$
是否置顶（0非，1是）	$sIsTop.DATA$
是否精华（0非，1是）	$sIsDigest.DATA$

图片类

属性	模板便签
主题图片-大图	$sInfoImageAddr.DATA$
主题图片-缩略图	$sInfoImageAbbrAddr.DATA$
主题图片-中图	$sInfoImageAbbrAddrMiddle.DATA$
主题图片-小图	$sInfoImageAbbrAddrSmall.DATA$
所属频道预设的主题图-宽	$sImageAbbrSizeWidth.DATA$
所属频道预设的主题图-高	$sImageAbbrSizeHeight.DATA$

时间类

属性	模板便签
创建时间完整格式（年-月-日时:分:秒）	$dtCreateTime_org.DATA$
创建日期正常格式（年-月-日）	$dtCreateTime.DATA$
创建日期短格式（月/日）	$dtCreateDate.DATA$
创建日期短格式（月/日）	$dtCreateDateShort.DATA$
发布时间完整格式（年-月-日时:分:秒）	$dtReleaseTime_org.DATA$
发布日期正常格式（年-月-日）	$dtCreateDateShort.DATA$
发布日期短格式（月/日）	$dtReleaseDateShort.DATA$

活动类

属性	模板便签
活动状态（2:即将开始；1:进行中；0:非活动）	$iActivityStats.DATA$
资讯活动开始时间	$dtBegTime.DATA$
资讯活动结束时间	$dtEndTime.DATA$

属性	模板便签
相关资讯标题	$sTitle.DATA$
相关资讯详情页连接	$infoPath.DATA$
上一页数	$pagePrevious.DATA$

使用步骤

根据下图目录格式，提交内部重构审核。注意其中的公共文件
产品，内部重构确认文件没有问题后，使用AMS模版工具，将文件编译成包含模版字段的模版
使用工具编译完成，提交seperHtml文件夹

广告系统

<style>
.ggBox { width:640px; height:300px;}/*修改成广告图片的尺寸即可*/
.ggBox { position:relative; background:#0e97dc; overflow:hidden}
/*以下是轮播的图片样式，不用修改*/
.adPic { position:absolute; width:100%; height:100%; left:0; top:0}
.adPic a { display:block; width:100%; height:100%; overflow:hidden; position:absolute; left:0; top:0; background:#0e97dc}
.adPic img { width:100%; height:100%; position:absolute; top:0; left:0}
.adPic p { position:relative; padding-top:50px}
.loadI { width:130px; text-align:center; line-height:20px; color:#FFF; background:#18b2ff; margin:0px auto; display:block}
.adPicUl { width:1000%; height:100%; overflow:hidden; -webkit-transition: all 0.1s linear; -webkit-transform-style:preserve-3d;-webkit-backface-visibility: hidden}
 .adPicUl li { float:left; width:14.3%; height: 100%;}
.adPicUl a { display:block; width:100%; height: 100%}
.adPicUl img { display:block; width:100%; height:100%}
 /*以下是轮播小按钮样式，可按设计稿自己修改~*/
.adBtn { position:absolute; z-index:2; right:17px; bottom:20px; height:20px}
.adBtn a { display:block; float:left; text-indent:-5000px; margin-right:3px; overflow:hidden; width:19px; height:19px; background-image:url(https://ossweb-img.qq.com/images/game/portal2012/roll_btn.png); background-repeat:no-repeat;
 background-position:0 1px}/*小按钮样式*/
a.on { background-position:-19px 1px;_background:#efefef}/*小按钮当前帧样式*/
.adBtn a:hover { background-position:-19px -18px}/*小按钮鼠标经过样式*/
</style>
<div class="ggBox" id="ggBox"></div>
<script src="http://ossweb-img.qq.com/images/js/comm/tgAds.min.js"></script>
<script>
var rollad = new tgAds({
  ggID: '15938', //填写轮播广告所属的频道ID("频道管理"-"频道ID")
  info: '201710',
  //info的值可以有2种形式：1.直接填写需要的这几帧的广告位ID("广告位管理"-"广告位ID")
  // |或者| 2.填写广告位所属组ID("广告位管理"-"广告位所属组ID"),
  box: 'ggBox', //[可选参数]填写放置广告的div的ID//以下参数都是可选！
  pgv: 'mainAd', // PTT点击流'mainAd'：点击流名称，序号会自动加会自动上报:PTTSendClick('adRoll','mainAd1','轮播广告1')
  auto: false, //[可选参数]false移动端禁止自动滚动，不添加此项或者true为定时自动滚动
  mouse: false,
  //[可选参数,若点击触发请删掉此项]，true为鼠标经过小按钮触发翻页。
  //false和默认为点击小按钮触发翻页。最好是点击触发，不然晃得眼花
  noUrl: false, //[可选参数]如果只纯展示不希望点击跳转请用这个参数
  callBack: function () {
    //[可选参数]在广告准备完毕后运行的回调函数
    //console.log('一共有' + this.btns.length + '个广告')
  }
});
</script>

新闻系统

场景一：首页模版

顾名思义，是对首页的各个模块接入ams（新闻系统）

普通资讯

<%root%>
<%NewsListData%>
<%NewsData%>
<li>
<span class="new">[$sTypeName.DATA$]</span>
<a href="$infoPath.DATA$"> 
<span class="time">$dtReleaseDate.DATA$</span>
$sTitle.DATA$
</a>
</li> 
<%/NewsData%>
<%/NewsListData%>
<%/root%>

首页主KV展示背景图或视频

<%root%>
<%NewsListData%>
<%NewsData%>
<div class="kv-bg" style="background-image: url($sInfoImageAddr.DATA$);">
<%@if($sField1Value.DATA$!)%>
<video><source src="$sField1Value.DATA$" type="video/mp4"></source></video>
<%@endif%>
<a href="$infoPath.DATA$" onclick="PTTSendClick('btn','topkv','进入专题');" class="kv_link" title="查看详情">查看详情</a>
</div>
<%/NewsData%>
<%/NewsListData%>
<%/root%>

含条件判断模版

<%root%>
<%@SetVar(i,1)%>
<%NewsListData%>
<%NewsData%> 
<li class="<%@if(GetVar(i)=1)%>line_sp<%@endif%>"> 
<span class="new">[$sTypeName.DATA$]</span>
<a href="$infoPath.DATA$"> 
<span class="time">$dtReleaseDate.DATA$</span>
$sTitle.DATA$
</a>
</li> 
<%@SetVar(i,Plus(GetVar(i),1))%> 
<%/NewsData%>
<%/NewsListData%>
<%/root%>

json格式模版

<%root%>
var FreeHeroIndexData = [{}
<%NewsListData%>
<%NewsData%>
,{"sTitle":"$sTitle.DATA$","sSubContent":"$sSubContent.DATA$"}
<%/NewsData%>
<%/NewsListData%>
];
<%/root%>

场景二、列表页模版

普通列表页模版

<%root%>

<!DOCTYPE html>
<html lang="zh-CN">
<head>

<meta charset="gbk" />
...
<title></title> 
</head>
<body>

<ul> 
<%NewsListData%>
<%NewsData%>
<li>
<img src="$sInfoImageAddr.DATA$" />
<div class="content-name s-left">
<p>$sTitle.DATA$</p>
<p>$sSubContent.DATA$</p>
</div>
</li>
<%/NewsData%>
<%/NewsListData%>
</ul>
<%PageData%>
<%@if($pagePrevious.DATA$!)%>
<a data-href="$pagePrevious.DATA$" href="#" class="next prev"><上一页</a>
<%@endif%>
<%@if($pageNext.DATA$!)%>
<a data-href="$pageNext.DATA$" href="#" class="next">下一页></a>
<%@endif%>
<%/PageData%>
</body>
</html>

<%/root%>

移动端上滑或点击加载更多

<%root%>
<%@SetVar(i,1)%>
<%NewsListData%>
<%NewsData%>
<li class="clearfix">
<a href="$infoPath.DATA$" class="img s-left">
<img src="$sInfoImageAddr.DATA$" />
</a>
<a href="$infoPath.DATA$" class="data s-left">
<span>$sTitle.DATA$</span>
<span>$dtReleaseDate.DATA$</span>
</a>
<%@if(GetVar(i)<4)%>
<span class="spr num-ph"><%@GetVar(i)%></span>
<%@else%>
<p class="gxqm">$sSubContent.DATA$</p>
<%@endif%>
</li>
<%@SetVar(i,Plus(GetVar(i),1))%>
<%/NewsData%>
<%/NewsListData%>
<li>
<%PageData%>
<%@if($pageNow.DATA$>5|$pageNow.DATA$=$pageTotal.DATA$)%>
<div class="video-more" data-pagenow="$pageNow.DATA$" data-pagetotal="$pageTotal.DATA$" data-pagenext="$pageNext.DATA$">
<a href="javascript:;" class="s-left">已显示全部内容</a>
</div>
<%@else if($pageTotal.DATA$>1)%>
<div class="video-more" data-pagenow="$pageNow.DATA$" data-pagetotal="$pageTotal.DATA$" data-pagenext="$pageNext.DATA$">
<img class="s-left" src="//game.gtimg.cn/images/poker/cp/a20170730wsop/more.png" />
<a href="javascript:;" class="s-left">拖动加载更多</a>
</div>
<%@else%>
<div class="video-more" data-pagenow="$pageNow.DATA$" data-pagetotal="$pageTotal.DATA$" data-pagenext="$pageNext.DATA$">
<a href="javascript:;" class="s-left">已显示全部内容</a>
</div>
<%@endif%>
<%/PageData%>
</li>
<%/root%>

场景三、详情页模版

资讯详情页模版

<%root%>
<%OneNewsData%>

<!DOCTYPE html>
<html lang="zh-CN">
<head>

<meta charset="gbk" />
...
<title>$sTitle.DATA$- 新闻详情-官网</title>
</head>
<body> 
<div class="header"> 
<span class="s-left">新闻资讯 /</span>
<span class="s-left"> NEWS INFOMATION</span>
</div>
<div>
<h1>$sTitle.DATA$</h1>
$sContent.DATA$
</div> 

</body>
</html>
<%/OneNewsData%>
<%/root%>

视频详情页模版

<%root%>
<%OneNewsData%> 
<!DOCTYPE html>
... 
<div class="cont">
<div class="detail-nav-guid">
您当前的位置：<a target="_blank">首页</a>/<a target="_blank">游戏攻略</a>/<span>攻略详情</span>
</div>
<div class="main-cont">
<h3> $sTitle.DATA$</h3>
<span>$dtReleaseDate.DATA$</span>
<div id="live_player"></div>
<div>$sContent.DATA$</div>
</div>
</div>
<script src="//ossweb-img.qq.com/images/js/jquery/jquery-1.11.3.min.js"></script>
<script src="//ossweb-img.qq.com/images/js/PTT/ping_tcss_tgideas_https_min.js"></script>
<script src="//imgcache.gtimg.cn/tencentvideo_v1/tvp/js/tvp.player_v2.js" charset="utf-8"></script>
<script>
liveTV('$sKeyWord.DATA$')
function liveTV(vid) {
var video = new tvp.VideoInfo(); video.setVid(vid);
var player = new tvp.Player();
player.create({ width: 1000, height: 600, video: video, modId: "live_player", //live_player是刚刚在页面添加的div容器 autoplay: true });
}
</script>
</body>
</html> 
<%/OneNewsData%>
<%/root%>

场景四、活动中心模版

（活动状态$iActivityStats.DATA$（2:即将开始；1:进行中；0:非活动））

<%root%> 
...
<meta charset="gbk" />
...

<div class="act_top">
 <ul>
 <li class="current">全部</li>
 <li>进行中</li>
 <li>已结束</li>
 </ul>
</div>
<div class="act_content">
 <ul class="act_list" style="display: block;">
 <%NewsListData%>
 <%NewsData%>
 <li class="actnormal actend">
 <div class="act_img">
 <img width="383" height="166" alt="$sTitle.DATA$" src="$sInfoImageAddr.DATA$" />
 </div>
 <div class="act_innr">
 <div class="act_desc"><span class="act_tit">$sTitle.DATA$</span></div>
 <div class="act_desc"><span class="act_date">开始时间：$dtBegTime.DATA$</span><span class="act_date">结束时间：$dtEndTime.DATA$</span></div>
 <p class="act_intro">$sSubContent.DATA$</p>
 </div>
 <div>
 <em>
 <%@if($iActivityStats.DATA$=2)%><span class="ac_ing">即将开始</span>
 <%@else if($iActivityStats.DATA$=1)%><span class="ac_ing">进行中</span>
 <%@else%><span class="ac_ing end_ac">已结束</span>
 <%@endif%>
 </em>
 </div>
 <a class="act-info" href="$infoPath.DATA$" target="_blank"><h5 class="act-tit2">活动简介</h5><p class="act-tx">$sSubContent.DATA$</p><span class="act-lnk"><i class="commspr commico-arrright"> </i> 查看活动详情</span><i class="act-sbg2"> </i></a>
 </li>
 <%/NewsData%>
 <%/NewsListData%>
 </ul>

 <ul class="act_list" style="display: none;">
 <%NewsListData%>
 <%NewsData%>
 <%@if($iActivityStats.DATA$=1)%>
 <li class="actnormal">
 <div class="act_img">
 <img width="383" alt="$sTitle.DATA$" height="166" src="$sInfoImageAddr.DATA$" />
 </div>
 <div class="act_innr">
 <div class="act_desc"><span class="act_tit">$sTitle.DATA$</span></div>
 <div class="act_desc"><span class="act_date">开始时间：$dtBegTime.DATA$</span><span class="act_date">结束时间：$dtEndTime.DATA$</span></div>
 <p class="act_intro">$sSubContent.DATA$</p>
 </div>
 <div class="publicspr act-times act-timesing act-img$iActivityStats.DATA$"><em>进行中</em></div>
 <a class="act-info" href="$infoPath.DATA$" target="_blank"><h5 class="act-tit2">活动简介</h5><p class="act-tx">$sSubContent.DATA$</p><span class="act-lnk"><i class="commspr commico-arrright"> </i> 查看活动详情</span><i class="act-sbg2"> </i></a>
 </li>
 <%@endif%>
 <%/NewsData%>
 <%/NewsListData%>
 </ul>
 <ul class="act_list" style="display: none;">
 <%NewsListData%>
 <%NewsData%>
 <%@if($iActivityStats.DATA$=0)%>
 <li class="actnormal">
 <div class="act_img">
 <img width="383" alt="$sTitle.DATA$" height="166" src="$sInfoImageAddr.DATA$" />
 </div>
 <div class="act_innr">
 <div class="act_desc"><span class="act_tit">$sTitle.DATA$</span></div>
 <div class="act_desc"><span class="act_date">开始时间：$dtBegTime.DATA$</span><span class="act_date">结束时间：$dtEndTime.DATA$</span></div>
 <p class="act_intro">$sSubContent.DATA$</p>
 </div>
 <div class="publicspr act-times act-timesing act-img$iActivityStats.DATA$"><em>已结束</em></div>
 <a class="act-info" href="$infoPath.DATA$" target="_blank"><h5 class="act-tit2">活动简介</h5><p class="act-tx">$sSubContent.DATA$</p><span class="act-lnk"><i class="commspr commico-arrright"></i> 查看活动详情</span><i class="act-sbg2"></i></a>
 </li>
 <%@endif%>
 <%/NewsData%>
 <%/NewsListData%>
 </ul>
</div>

<%/root%>

场景五、赛事弹窗

弹窗自动上下线，自定义一天弹出次数

模版文件：

<%root%>
<script>
  <%NewsListData%>
  <%NewsData%>
  var popData = {
    "title": "$sTitle.DATA$",
    "txt": "$sSubContent.DATA$",
    "vid": "$sField1Value.DATA$",
    "num": "$sField2Value.DATA$",
    "img": "$sInfoImageAddr.DATA$",
    "link": "$infoPath.DATA$",
    "time": "$dtReleaseDateShort.DATA$"
  };
  var videoLinkUrl = "$sDetailUrl.DATA$";
  if (videoLinkUrl && document.getElementById('popVideoLink')) {
    document.getElementById('popVideoLink').href = videoLinkUrl;
  }
  <%/NewsData%>
  <%/NewsListData%>
</script>
<%/root%>

js部分：

(function () {
  function createChannel(wrapId, cid, width, height) {
    $.getScript("//game.gtimg.cn/images/js/swfobject.js", function () {
      $.getScript("//imgcache.qq.com/tencentvideo_v1/tvp/js/tvp.player_v2_jq.js", function () {
        var video = new tvp.VideoInfo();
        video.setChannelId(cid);
        var player = new tvp.Player();
        player.create({
          width: width,
          height: height,
          type: 1,
          video: video,
          modId: wrapId,
          autoplay: true
        });
      })
    })
  }

  function popVideo() {
    $("#video_pop").css("background", "url(" + popData.img + ") no-repeat 0 0");
    createChannel("mod_player", cid, '100%', 490);
    setTimeout(function () {
      TGDialogS('video_pop');
    }, 500);
  }
  var cid = popData.vid,
    num = popData.num,
    showpop,
    showflag = false;
  /*cid等于0，下线弹窗，num为弹窗次数，1次或N次*/
  if (cid !== '0') {
    if (num == '1') {
      var mvShowed = JSON.parse(localStorage.getItem('mvshowflag'));
      if (!mvShowed || (mvShowed && +new Date().getTime() - mvShowed.expire > 1000 * 60 * 60 * 24)) {
        popVideo();
        localStorage.setItem('mvshowflag', JSON.stringify({
          'show': true,
          'expire': new Date().getTime()
        }));
      }
    } else {
      popVideo();
    }
  }
})();

AMS模版字段

AMS系统模版文件集

模版文件注意事项

模版标签参考

最常用

文章属性类

标题属性类

图片类

时间类

活动类

相关资讯类

使用步骤

广告系统

新闻系统

场景一：首页模版

普通资讯

首页主KV展示背景图或视频

含条件判断模版

json格式模版

场景二、列表页模版

普通列表页模版

移动端上滑或点击加载更多

场景三、详情页模版

资讯详情页模版

视频详情页模版

场景四、活动中心模版

场景五、赛事弹窗

results matching ""

No results matching ""