一、 模板目录作用说明(以默认模板为例)
/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中文官网去查看手册, https://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自带的除外)
（举报）