[TOC]
#基礎
## 1、全局變量
NewThink封裝了前臺模板開發時常用的一些變量,這些變量是全局的,你在前臺模板任何時候都能直接調用:
```
{$site_name} //站點名稱
{$site_host} //站點域名
{$site_root} //安裝目錄
{$site_icp} //備案信息
{$site_police} //公安局備案信息
{$site_company_address} //公司地址
{$site_admin_email} //管理員郵箱
{$site_copyright} //版權信息
{$site_tongji} //頁面統計代碼
{$site_seo_title} //SEO標題
{$site_seo_keywords} //SEO關鍵字
{$site_seo_description} //SEO描述
```
## 2、模板注釋
js注釋:
```html
<script>
/* js注釋*/
</script>
```
css注釋
```html
<style>
/*css注釋*/
</style>
```
html注釋
```html
<div>
<!--html注釋-->
</div>
```
php標簽里的注釋
```html
<php>
/*一定要用這個方法,用//會在debug關時出問題*/
</php>
```
## 3、模板常量
```
__ROOT__ //網站根目錄,不帶/
__TMPL__ //模板根目錄,帶/
//如:前臺 simplebootx 模板根目錄是/themes/simplebootx/
//后臺 simplebootx模板根目錄是/admin/themes/simplebootx/
__PUBLIC__ //public目錄,不帶/
```
## 4、變量輸出
請參考:http://www.hmoore.net/manual/thinkphp/1794
## 5、使用函數
請參考:http://www.hmoore.net/manual/thinkphp/1796
## 6、模板結構
NewThink模板目錄結構如下:
```
|--themes
|--simplebootx
|--Portal
|--index.html
```
模板開發時我們僅需要在`themes`目錄下創建一個模板文件夾,假設為`simplebootx`,`simplebootx`文件夾下我們需要創建一個應用名稱的文件夾,比如`Portal`。一般情況下我們還會創建一個`Public`文件夾用來存放公共的css,js等資源文件。
```
|--themes
|--simplebootx //模板目錄
|--Comment
|--comment.html //評論模板,{:Comments()}中會調用
|--index.html //用戶中心評論模板(鏈接:comment/comment/index)
|--Portal
|--404.html //錯誤模板
|--article.html //默認文章頁模板
|--contact.html //聯系我們頁面模板,可以后臺頁面編輯里更改,只需寫文件名contact
|--index.html //首頁模板
|--list_masonry.html //文章列表頁瀑布流模板
|--list.html //文章列表頁模板
|--page.html //默認頁面模板
|--product.html //產品列表頁模板,可以在后臺分類編輯里設置列表頁模板,只需寫文件名product
|--search.html //文章搜索頁模板
|--Public //模板公共資源目錄
|--User
|--Profile
|--avatar.html //頭像編輯界面
|--bang.html //第三方賬號綁定界面
|--edit.html //資料編輯界面
|--password.html //密碼修改界面
|--active.html //用戶激活模板
|--center.html //用戶中心模板
|--disable.html //用戶未激活,重發激活郵件模板
|--favorite.html //我的收藏模板
|--forgot_password.html //忘記密碼模板
|--index.html //用戶主頁,公開主頁
|--login.html //用戶登錄模板
|--password_reset.html //密碼重置模板
|--register.html //用戶注冊模板
|--config.html //模板配置文件
|--jump.html //系統跳轉頁模板
|--error.html //系統action錯誤模板
|--success.html //系統action操作成功模板
```
## 7、模板資源文件引入
引入css文件:
```html
<!-- 引入simpleboot庫,此文件必須引入-->
<link href="__TMPL__Public/simpleboot/themes/simplebootx/theme.min.css" rel="stylesheet">
<!-- 引入simpleboot responsive庫,此文件可選擇引入,用于支持多屏幕響應-->
<link href="__TMPL__Public/simpleboot/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet">
<!-- 引入奧森圖標庫,此文件可選擇引入,用于支持字體圖標,用法見http://www.thinkcmf.com/font-->
<link href="__TMPL__Public/simpleboot/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- 引入奧森圖標ie7支持庫,此文件可選擇引入,用于支持IE7字體圖標,用法見http://www.thinkcmf.com/font-->
<!--[if IE 7]>
<link rel="stylesheet" href="__TMPL__Public/simpleboot/font-awesome/4.4.0/css/font-awesome-ie7.min.css">
<![endif]-->
<!-- 引入自定義css庫,用戶可加入自己的css組件-->
<link href="__TMPL__Public/css/style.css" rel="stylesheet">
```
以上內容加在</head>標簽以前
引入js文件:
```html
<script type="text/javascript">
//全局變量,必須加入
var GV = {
DIMAUB: "__ROOT__/",
JS_ROOT: "public/js/"
};
</script>
<!-- 引入jquery-->
<script src="__PUBLIC__/js/jquery.js"></script>
<!-- 引入wind庫,用于js異步加載-->
<script src="__PUBLIC__/js/wind.js"></script>
<!-- 引入bootstrap庫,包含bootstrap各種組件-->
<script src="__TMPL__Public/simpleboot/bootstrap/js/bootstrap.min.js"></script>
<!-- 引入NewThink前端庫,包含NewThink各種組件,方法,如評論,贊等-->
<script src="__PUBLIC__/js/frontend.js"></script>
```
以上內容加在`</body>`標簽以前
- HBuilder擴展代碼塊
- Sublime擴展代碼塊
- 模板
- 基礎
- 模板標簽
- 前端組件
- 公共模板
- 進階
- 前臺模板
- 房產裝修風格
- 博客類模板
- 企業站-監控模板
- 后臺模板
- 漂亮的后臺模板
- ThinkCMF 1.6 后臺界面升級
- 新的模板
- 后臺UI
- H+后臺主題
- Ace Admin
- 信息系統(橙藍)
- 阿里云UI
- 不錯的網站
- 常見問題
- dedecms 模板修改為 newthink 模板目錄的步驟
- 網站信息 新增條目方法
- 系統切換中英文
- 2.3 門戶模板制作
- 文章列表頁制作
- 文章內容頁制作
- 頁面制作
- 獲取文章的各種方式
- 熱門文章組件制作
- SEO制作
- 文章相冊制作
- 文章列表推薦功能制作
- 文章列表置頂功能制作
- 面包屑制作
- 格式化