## 創建主題模版
第一步.創建主題布局模版
在主題目錄下public目錄中創建layout.html模版
~~~
<!DOCTYPE html>
<!--[if IE 8]> <html lang="zh-CN" class="ie8"> <![endif]-->
<html lang="zh-CN">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>{$meta_title|default="EacooPHP系統"}</title>
<meta content="telephone=no,email=no,address=no" name="format-detection" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="wap-font-scale" content="no" />
<meta name="Keywords" content="{:config('web_site_keyword')}" />
<meta name="Description" content="{:config('web_site_description')}" />
<meta name="frontend-mobile" content="yes" />
<link type="text/css" rel="stylesheet" href="__PUBLIC__/css/bootstrap.min.css"/>
<!-- Font Awesome -->
<link rel="stylesheet" href="//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
{load href="__ADMIN_CSS__/AdminLTE.min.css,__ADMIN_CSS__/_all-skins.min.css,__PUBLIC__/css/animate.min.css,__PUBLIC__/css/base.css" /}
<link type="text/css" rel="stylesheet" href="__THEME_CSS__/style.css?v=1.0.1"/>
{block name="style"}{/block}
<script type="text/javascript" src="__PUBLIC__/js/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
var EacooPHP = window.EacooPHP = {
"root_domain": "{$Request.domain}", //當前網站地址
"static": "__STATIC__", //靜態資源地址
"public": "__PUBLIC__", //項目公共目錄地址
"uploads_url" :'/uploads/',
"cdn_url":"{:config('aliyun_oss.domain')}",
}
</script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
{:hook('PageHeader')}
</head>
<body class="hold-transition skin-blue layout-top-nav">
<div class="wrapper">
<header class="main-header">
<nav class="navbar navbar-static-top">
<div class="container">
<div class="navbar-header">
<a href="/" class="navbar-brand logo"><img class="logo-img" src="__ROOT__/eacoophp_logo_v1.png"></a>
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
<i class="fa fa-bars"></i>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse pull-left" id="navbar-collapse">
<!--頂部導航 start-->
<ul class="nav navbar-nav">
{notempty name="header_menus"}
{volist name="header_menus" id="row"}
<li class="{notempty name="row._child"}dropdown{/notempty}">
{empty name="row._child"}
<a href="{$row.value|eacoo_url=###,[],$row.depend_type|default=''}" target="{$row.target|default=''}" title="{$row.title|default=''}">{notempty name="row.icon"}<i class="{$row.icon}"></i>{/notempty} {$row.title|default='未知'}</a>
{else/}
<a href="#" class="dropdown-toggle" data-toggle="dropdown">{notempty name="row.icon"}<i class="{$row.icon}"></i>{/notempty} {$row.title|default='未知'}<span class="caret"></span></a>
{/empty}
{notempty name="row._child"}
<ul class="dropdown-menu" role="menu">
{volist name="row._child" id="child"}
<li><a href="{$child.depend_type==1?url($child['value']):plugin_url($child['value'])}">{$child.title}</a></li>
{/volist}
</ul>
{/notempty}
</li>
{/volist}
{else/}
<li class="active"><a href="/">主頁 <span class="sr-only">(current)</span></a></li>
<li><a href="{:url('user/index/index')}">會員<span class="sr-only">會員</span></a></li>
<li><a href="https://gitee.com/ZhaoJunfeng/EacooPHP/attach_files" target="_blank">下載</a></li>
<li><a href="http://forum.eacoo123.com" target="_blank">社區</a></li>
<li><a href="http://www.hmoore.net/youpzt/eacoo" target="_blank">文檔</a></li>
{/notempty}
</ul>
<!--頂部導航 end-->
<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control" id="navbar-search-input" placeholder="Search">
</div>
</form>
</div>
{empty name="current_user"}
<li><a href="{:url('user/login/login')}">登錄</a></li>
{else/}
<li class="dropdown user user-menu">
<!-- Menu Toggle Button -->
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<!-- The user image in the navbar-->
<img src="{$current_user.avatar}" class="user-image" alt="{$current_user.nickname}">
<!-- hidden-xs hides the username on small devices so only the image appears. -->
<span class="hidden-xs">{$current_user.nickname}</span>
</a>
<ul class="dropdown-menu">
<!-- The user image in the menu -->
<li class="user-header">
<img src="{$current_user.avatar}" class="img-circle" alt="User Image">
<p>
{$current_user.nickname}
<small>注冊時間:{$current_user.reg_time}</small>
</p>
</li>
<!-- Menu Body -->
<!--<li class="user-body">
<div class="row">
<div class="col-xs-4 text-center">
<a href="#">Followers</a>
</div>
<div class="col-xs-4 text-center">
<a href="#">Sales</a>
</div>
<div class="col-xs-4 text-center">
<a href="#">Friends</a>
</div>
</div>
<!– /.row –>
</li>-->
<!-- Menu Footer-->
<li class="user-footer">
<div class="pull-left">
<a href="{:url('user/index/personal')}" class="btn btn-default btn-flat">個人資料</a>
</div>
<div class="pull-right">
<a href="{:url('user/login/logout')}" class="btn btn-default btn-flat">退出</a>
</div>
</li>
</ul>
</li>
{/empty}
</ul>
</div>
<!-- /.navbar-custom-menu -->
</div>
<!-- /.container-fluid -->
</nav>
</header>
<!-- 站點 -->
{block name="main"}
{/block}
<strong>Copyright © 2016-2018 <a href="http://www.eacoo123.com" target="_blank">EacooPHP</a>.</strong> 保留所有權利。
</footer>
</div>
<!-- ./wrapper -->
{:hook('PageFooter')}
{:config('web_site_statistics')}
{block name="script"}{/block}
</body>
</html>
~~~
**第二步.繼承主題布局模版**
創建自定義模版,是基于繼承主題目錄pubic/layout布局模版
~~~
{extend name="$_theme_public_layout"/}
{block name="style"}
<!--自定義加載style-->
{/block}
{block name="main"}
<!--內容區-->
{/block}
{block name="script"}
<!--自定義加載javascript-->
{/block}
~~~
- 前言
- 基礎
- 安裝
- 規范
- 數據庫設計
- 命名規范
- 建議參考
- 架構
- 架構總覽
- 目錄結構
- 生命周期
- 入口文件
- 模塊設計
- 插件設計
- 主題設計
- API設計
- 容器和依賴注入
- 驗證器設計
- 鉤子和行為設計
- 介紹
- 后臺介紹
- 儀表盤
- 系統設置
- 系統設置
- 網站設置
- 前臺導航菜單
- 后臺導航菜單
- 配置管理
- 用戶管理
- 權限管理
- 角色組
- 節點管理
- 附件管理
- 工具
- 擴展中心
- 模塊
- 插件
- 主題
- 前臺介紹
- API接口
- 模型層
- 定義
- 邏輯層
- 定義
- 邏輯初始化
- 服務層
- 定義
- 二次開發
- 模塊開發
- 介紹
- 1.結構目錄
- 2.install安裝目錄文件
- info.json
- options.php
- menus.php
- unstall.sql
- install.sql
- 3.安裝模塊
- 模塊函數與全局函數
- 其他
- 插件開發
- 介紹
- 定義入口文件
- 1.結構目錄
- 2.install安裝目錄文件
- info.json
- options.php
- menus.php
- install.sql
- unstall.sql
- 3.實現鉤子方法
- 4.安裝插件
- 開發使用
- 插件控制器Controller
- 插件模型Model
- 插件邏輯層Logic
- 開發總結
- 主題開發
- 介紹
- 結構目錄
- install安裝目錄
- info.json
- 主題變量
- 模塊主題化
- 插件主題化
- CSS、JS靜態資源引入
- 創建模版文件
- API開發
- 通用組件
- wangeditor編輯器
- 上傳
- 實戰開發
- 控制器
- 驗證器
- 接口
- 創建自定義模版
- 數據庫操作
- 通過接口上傳文件
- 構建器Builder(重要)
- 表單Form
- 設置頁面標題
- 表單項(調用方式)
- 文本框text
- 隱藏域hidden
- 文本區textarea
- 時間選擇器datetime
- 圖片選擇器picture
- 多圖片選擇器pictures
- 圖片上傳image
- 文件上傳file
- wang編輯器wangeditor
- 百度富文本編輯器ueditor
- 選擇項
- 添加標簽欄Tab
- 自定義頭部工具欄
- 表單提交處理
- 列表List
- 設置頁面標題
- 添加標簽欄Tab
- 高級查詢
- 查詢構造器
- 添加列表搜索功能
- 添加批量操作
- 自定義頭部工具
- 頂部新增按鈕
- 頂部批量啟用
- 頂部批量禁用
- 排序Sort
- 表單驗證
- 插件-Builder構建器
- 命令行
- 配置
- 擴展專題
- 輕松識別客戶端信息User Agent
- 字符串
- 數組
- 鉤子、插件、模塊相關方法
- 時間
- 請求(request)
- 附件
- 用戶信息
- 前臺用戶
- 后臺用戶
- 微信(wechat模塊)
- 專題
- 插件專題
- 微信支付
- 支付寶(即時到賬)
- 微信小程序專題
- 微信模塊
- 日志
- 后臺行為日志
- 框架日志
- 自定義日志
- 常見問題集
- 附錄
- 配置參考
- 常量參考
- 變量參考
- 更新日志
- 升級指導
- 關于
- 進階
- 分布式數據庫
- 分布式緩存
- 負載均衡
- Redis
- 分庫分表