WeCenter 2.x模板开发基础教程

一、 模板目次浸染声名(以默认模板为例)

/views/default/

/account – 账户相干模板,如登录,注册等

/admin –  靠山

/block – 通用模块

/config – 设置分页样式

/favorite – 我的保藏

/feature – 专题

/global – 全局通用模块,如头部,底部

/home – 首页,发明页

/inbox – 私信

/install – 安装

/invitation – 约请挚友

/m – 移动版本模板

/migrate – 安装上传目次配置

/notifications – 关照

/people – 小我私人页面

/publish – 提倡

/question – 题目

/reader – 阅读器

/search – 搜刮

/topic – 话题

留意 : 目次下ajax目次下模板为数据模板

二、Static目次下个体文件浸染声名 :

css(按照图片声名,以default为例)

bootstrap.css – bootstrap框架

glyphicons-halflings.png – bootstrap框架的icon图片

glyphicons-halflings-white.png – 同上

btn-sprite.css – 按钮css

common.css – 模板主css文件

ie7.css – ie7兼容性css

link.css – 全站字体颜色

login.css – 登录页面css

register.css – 注册页面css

user-setting.css – 用户配置页面css

user.css – 用户主页css

2.javascript(以图片声名)

aw_template.js – 页面通用模板文件,如弹窗模板

function.js – 全站根基成果函数

app.js – 页面加载时挪用的js

/editor – 编辑器js

/plug_module/plug-in_module.js – 全站基本框架js,内在jQuery,bootstrap,附件上传,Hogan模板引擎

三、模板担任机制

四、建设新模板要领

css建设 : 在static/css/目次下建设模板名字目次为newstyle,并在newstyle目次内建设响应名字的css文件,假若有响应模板的图片文件则再建设一个img目次,没有的话可以忽略,如下图所示

建设新的css后,可在内里添加新模板的css和重写default原有的css举办包围。留意 : css文件名字必需跟模板名字沟通 模板建设 : 在views目次下建设和模板名字沟通的文件夹,如下图所示

假设要为新的模板建造一个新的登岸页面,可以先将default目次下响应的目次和文件先拷贝到新的模板文件下再举办修改,下图所示 :

要修改此外模板也是一再以上操纵,建设了新模板文件后,登录靠山就可以在界面配置内里选择新的模板

留意 : 新模板的文件目次位置必必要跟default模板目次位置一样才气举办包围

五、页面根基布局

页面一样平常由头部,中间内容,底部构成,个中头部和底部是通用的, 有些页面会有侧边栏,这里举例一些通用模块挪用要领

头部挪用 : <?php TPL::output('global/header.tpl.htm'); ?>

底部挪用 : <?php TPL::output('global/footer.tpl.htm'); ?>

侧边栏挪用 : <?php TPL::output('block/sidebar_menu.tpl.htm'); ?> 因为页面的宽度为940px,我们有一个aw-wecenter的class来牢靠宽度 css定名都由aw-前缀为基本,可按照需求差异自行修改 页面机关参照bs2.3.2框架的机关方法,如下

若有迷惑可以到bs中文官网去查察手册, http://www.bootcss.com/scaffolding.html

六. 常用代码说明

常用模块代码布局

页面机关界说好容器后,都由上面两种模块代码嵌套构成,譬喻侧边栏

常用css代码说明

.aw-wecenter 限定页面宽度

.aw-main-content 限定首要内容宽度

.aw-side-bar 限定侧边栏宽度

.pull-left 左浮动

.pull-right 右浮动

.clearfix 破除浮动

icon都以.aw-icon + icon名字定名,譬喻 .aw-icon . i-v (bs自带的除外)

btn都以.aw-btn + btn名字定名,譬喻.aw-btn . b-new-user (bs自带的除外)

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!