模版是MVC中比较简单的一块,零云模版默认采用ThinkPHP的模版继承来实现。也就是通过block区块来控制页面的局部内容显示。
关于模版继承的详细讲解请访问http://document.thinkphp.cn/manual_3_2.html#template_extend
注意零云在TP的基础上二次开发支持了PC端和手机端分别使用两套模块,规范是,比如新闻列表PC端模板路径是Application/Cms/View/Pc/Index/list.html,那么对应的手机端模板路径是Application/Cms/View/`Wap`/Index/list.html
一个标准的PC端Bootstrap模板如下:
```html
<extend name="$_home_public_layout">
<block name="style">
<style>
<!-- 这里写当前页面的CSS-->
.example-css {
width: 20px;
}
</style>
</block>
<block name="main">
<div class="container">
<div class="row">
<div class="col-xs-12">
<div class="alert alert-danger" role="alert">
<h4>您现在访问的是零云模块:</h4>
<p>该页面是为演示页面!</p>
</div>
</div>
</div>
</div>
</block>
<block name="script">
<script type="text/javascript">
// 这里写当前页面的JS
</script>
</block>
```
一个标准的手机网端F7模板如下
```html
<extend name="$_home_public_layout">
<block name="style">
<style>
<!-- 这里写当前页面的CSS-->
.example-css {
width: 20px;
}
</style>
</block>
<block name="main">
<!-- 这是页面顶部导航条-->
<div class="navbar">
<div class="navbar-inner">
<div class="left">
<a href="{:U('Home/Index/index', '', true, true)}" class="link back icon-only">
<i class="icon icon-back"></i>
</a>
</div>
<div class="center">{$meta_title}</div>
<div class="right"></div>
</div>
</div>
<div data-page="index" class="page page-on-center">
<div class="page-content">
<!-- 这里写页面主体内容 -->
</div>
</div>
</block>
<block name="script">
<script type="text/javascript">
// 这里写当前页面的JS
</script>
</block>
```</extend></extend>
- 简介
- 环境要求
- 安装系统
- 目录结构
- 常见问题
- 基础知识
- 编辑器
- 前端规范
- 前端框架文档
- Builder教程
- Builder的来历
- ListBuilder使用
- setMetaTitle
- addTopButton
- setSearch
- addSearchItem
- setTabNav
- addTableColumn
- setTableDataList
- setTableDataListKey
- setTableDataPage
- addRightButton
- alterTableData
- setExtraHtml
- setTemplate
- FormBuilder使用
- setMetaTitle
- setTabNav
- setExtraItems
- setPostUrl
- addFormItem
- setFormData
- setExtraHtml
- setAjaxSubmit
- setTemplate
- 扩展FormBuilder
- 模块开发
- 创建模块
- 描述文件
- 模型( M )
- 模版( V )
- 控制器( C )
- API接口
- 核心模块
- 文件上传
- 微信小程序模块
- 注册登陆接口
- 钱包模块
- 统一支付
- Cms模块
- 幻灯片接口
- 文档列表接口
- 文档详情接口
- 发表评论接口
- 评论列表接口
- 收藏的文档接口
- 收藏接口
- 分类列表接口
- IM模块
- 发送消息接口
- 最近聊天列表接口
- 查询新消息接口
- 插件相关
- 短信插件
- 支付插件
- 支付宝支付
- 微信支付
- 站群模块
- 模板开发
- 准备工作
- 目录结构
- 数据调用
- 专题
- 插件开发
- 图片显示
- 获取用户信息
- 判断用户登陆
- 表单提交AjaX
- 文件上传
- 2.0兼容写法
- 模板标签
- 核心模块
- Cms模块
- 栏目分类调用
- Cordova
- 配置跨域支持
- 本地开发调试教程
- 打包成apk和ipa
- 自定义APP信息
- 常见问题
- 申请Apple开发者账户
- 多主题开发
- 新建主题
- 目录结构
- 模板变量
- 定制安装部署