网站服务部小组文档

新CMS模板说明

新的CMS模板,基于FIS3,模板语言是基于velocity

项目结构

    src
    |--cms     //存放cms的模板文件
    |    |--index.html    //首页模板,名字必须用这个
    |    |--list.html    //列表页模板,名字必须用这个
    |    |--news.html    //内页模板,名字必须用这个
    |--config    //存放配置文件,比如英雄卡牌数据,默认是不会打包发布出去
    |--global_include    //include文件,需要提供给其他页面include的
    |--template     //前端模板文件
    |--inline         //提供给本项目其他页面使用的公共页面
    |--data         //打包后的文件,路径不包含md5的值
    |--css             //less和css文件存放
    |--js             //js文件存放
    |--img             //图片资源
    cms_data.js     //本地调试使用到的测试数据
    cms_config.js     //新闻系统页面配置相关
    fis-conf.js     //fis配置文件

项目发布后的结构(与FIS2一样)

项目相关知识

如何安装FIS3,如何使用来开发,如何使用来打包发布等

1.安装FIS3的解决方案feg(基于小组的)

  • 安装Nodejs,直接到官网下载安装http://nodejs.org/
  • 安装feg,在命令行下,输入:
    npm install -g feg
  • 不需要额外安装其他插件,解决方案会集成

2.如何初始化基于FIS3的项目

希望基于FIS3的项目,不需要手动自己去建立文件夹结构与下载fis-conf.js的配置文件

  • 在空白文件夹中,输入命令:
    feg get fis3-cms
  • 修改fis3-cms-project文件夹名为自己项目的名字

3.Velocity模板语言

新的CMS支持新的模板语言Velocity,语言更接近我们平时使用的编程语言,具体使用方法,参考另一篇关于Velocity的文档

4.cms_data文件使用

此文件是保存了本地调试时候用到的假数据,方便本地预览和查看,假数据采用Mockjs来实现,可自行修改自己满意的假数据(默认不需要修改),变量对应的含义等,参考另外一篇文档

5.cms_config文件说明

此文件为保存配置了当前项目需要在新闻系统中新建哪些页面(不包括详情页),这样可以不需要去新闻系统上新建页面,发布工具会完成这过程

6.读取指定新闻分类接口

六马系统提供了在内页、列表中使用的单独接口,可以读取指定一个或者多个分类的新闻,主要用于右侧或者底部的新闻推荐等

    //调用示例
    $.ajax({
        url : 'https://sixhorse.game.163.com/news/outer/newslist.do',
        type : 'GET',
        data : {
            contentkind:"846",//分类ID,多个用逗号分隔
            limit:5, //获取条数
            start : 1, //第几页数据,默认从1开始
            beginDate : '2016-9-1', //开始时间,日期格式为'YYYY-MM-DD'
            endDate : '2016-9-2' //结束时间,同上 
        },
        dataType : 'jsonp',
        success : function(data){

            //接口调用失败
            if(!data.succ)return alert(data.msg);
            //新闻总条数
            data.count
            //遍历新闻
            for(var i=0,l=data.result.length;i<l;i++){

                var item = data.result[i];

                item.title  //新闻标题   
                item.url //新闻链接 
                item.showtime  //发布时间
                item.imageFileId //预留
                item.imageUrl  //新闻单个封面图url
                item.imageUrls //新闻多个封面图url,使用";"分割
                item.redirectUrl //跳转新闻跳转url
                item.comment //新闻摘要
            }
        },
        error : function(){}
    });

7.读取指定新闻的上一篇下一篇接口

六马系统提供了在内页使用的单独接口,可以读取具体新闻的上一篇新闻和下一篇新闻的内容

    //调用示例
    $.ajax({
        url : 'https://sixhorse.game.163.com/news/outer/newsprenext.do',
        type : 'GET',
        data : {
            contentKindCode: "15205",//新闻所属的分类ID
            newsCode : 648498, //新闻的code(非ID)
        },
        dataType : 'jsonp',
        success : function(data){

            //接口调用失败
            if(!data.succ)return alert(data.msg);

            //遍历新闻
            for(var i=0,l=data.result.length;i<l;i++){

                var item = data.result[i];

                item.title  //新闻标题   
                item.url //新闻链接 
                item.showtime  //发布时间
                item.imageFileId //预留
                item.imageUrl  //新闻单个封面图url
                item.imageUrls //新闻多个封面图url,使用";"分割
                item.redirectUrl //跳转新闻跳转url
                item.comment //新闻摘要
                item.type  //类型,1表示下一篇,2表示上一篇
            }
        },
        error : function(){}
    });

待补充