文章出處

smarty模板的作用可以讓前端和后端分離（也就是前端的顯示頁面和后端的php代碼）。

smarty模板的核心是一個類，下載好的模板中有這么幾個重要的文件夾

（1）libs核心文件夾
（2）int.inc.php這是入口文件
（3）plugins：自己寫的插件文件夾
（4）templates_c：存放編譯好的文件
（5）int.inc.php這是入口文件
（6）定義好常量：不能修改

一、如何實現前后分離的原理：
核心是一個類
1.左分隔符{
2.右分隔符}
3.數組（默認空數組）：存儲變量

4.提供一個方法：向模板中注冊變量的方法（assign（名字，值））
方法存在數組中的（找到數組存入變量）

5.還有一個方法：顯示模板的（display（模板的名稱或是路徑））
兩個功能：拿模板，解析變量

通過名稱就可以找到模板的路徑
$url = "模板路徑".$name ;

讀取模板文件，返回字符串
$str = file_get_contents($url);

將字符串的某些內容作了替換
1.將模板中的"名字"替換成 一段php代碼 echo $arr=[名字] 
2.將替換好的字符串保存到臨時文件或者是編譯好的文件
file_put_contents(存放的位置，上面替換好的字符串);
3.將編譯好的文件拿到當前頁面顯示
include(臨時文件的目錄);

二、怎么用模板？

模板頁面
1.引入模板的入口文件
include("入口文件路徑位置");

2.直接用對象
提供一個方法：向模板中注冊變量的方法（assign（名字，值）
$smarty->assign("ceshi","你好");
提供一個方法：顯示模板的（display（模板的名稱或是路徑））
$smarty->display("ceshi.html");


正常頁面
{assign(名字)}

注意：
1.訪問的是php的頁面，顯示的是html頁面
2.html用到了外部的樣式表，位置是相對于訪問的php頁面來找外部樣式

三、入口文件的內容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?php
 
define("ROOT",str_replace("\\","/",dirname(__FILE__)).'/'); //常量ROOT中指定項目根目錄
 
//echo str_replace("\\","/",dirname(__FILE__)).'/'; //獲取當前文件所在的位置
 
require ROOT.'libs/Smarty.class.php'; //加載Smarty類文件
$smarty = new Smarty(); //實例化Smarty對象
 
 
define("CSS_PATH","/project/css/");
define("JS_PATH","/project/js/");
 
//$smarty -> auto_literal = false; //就可以讓定界符號使用空格
$smarty->setTemplateDir(ROOT.'templates/'); //設置所有模板文件存放位置
//$smarty->addTemplateDir(ROOT.'templates2/'); //添加一個模板文件夾
$smarty->setCompileDir(ROOT.'templates_c/'); //設置編譯過的模板存放的目錄
$smarty->addPluginsDir(ROOT.'plugins/'); //設置為模板擴充插件存放目錄
$smarty->setCacheDir(ROOT.'cache/'); //設置緩存文件存放目錄
$smarty->setConfigDir(ROOT.'configs/'); //設置模板配置文件存放目錄
 
$smarty->caching = false; //設置Smarty緩存開關功能
$smarty->cache_lifetime = 60*60*24; //設置緩存模板有效時間一天
<br>//下面的內容是修改左和右的分隔符形式
$smarty->left_delimiter = '<{'; //設置模板語言中的左結束符
$smarty->right_delimiter = '}>'; //設置模板語言中的右結束符
 
?>

四、一些注意的點

（1）smarty注釋

模板注釋被*星號包圍，而兩邊的星號又被定界符包圍：

例如： 

1
{* this is a comment *}

注意：smarty注釋不會在模板文件的最后輸出中出現，這與<!-- HTML 注釋-->不同（譯注：html注釋在頁面源碼中可見，而smarty注釋則不能）也就是：注釋只存在于模板里面，而在輸出的頁面中誰也看不見。　

（2）從配置文件讀取的變量

配置文件的內容：

1
2
3
4
5
6
7
config file - foo.conf:
 
pageTitle = "This is mine"
bodyBgColor = '#eeeeee'
tableBorderSize = 3
tableBgColor = "#bbbbbb"
rowBgColor = "#cccccc"

主頁中寫的內容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//下面為配置文件變量“井號方法”的示例
{config_load file='foo.conf'}
<html>
<title>{#pageTitle#}</title>
<body bgcolor="{#bodyBgColor#}">
<table border="{#tableBorderSize#}" bgcolor="{#tableBgColor#}">
<tr bgcolor="{#rowBgColor#}">
<td>First</td>
<td>Last</td>
<td>Address</td>
</tr>
</table>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//下面為$smarty.config方法的示例：
 
{config_load file='foo.conf'}
<html>
<title>{$smarty.config.pageTitle}</title>
<body bgcolor="{$smarty.config.bodyBgColor}">
<table border="{$smarty.config.tableBorderSize}" bgcolor="{$smarty.config.tableBgColor"}>
<tr bgcolor="{$smarty.config.rowBgColor}">
<td>First</td>
<td>Last</td>
<td>Address</td>
</tr>
</table>
</body>
</html>

（3）加載配置文件后，配置文件中的變量需要用兩個井號"#"包圍或者是smarty的保留變量$smarty.config.來調用

{$smarty.now}取得當前時間戳，可以直接通過變量調節器date_format[格式化日期]輸出顯示

date_format轉換標記：

  • %a - 當前區域星期幾的簡寫
  • %A - 當前區域星期幾的全稱
  • %b - 當前區域月份的簡寫
  • %B - 當前區域月份的全稱
  • %c - 當前區域首選的日期時間表達
  • %C - 世紀值（年份除以 100 后取整，范圍從 00 到 99）
  • %d - 月份中的第幾天，十進制數字（范圍從 01 到 31）
  • %D - 和 %m/%d/%y 一樣
  • %e - 月份中的第幾天，十進制數字，一位的數字前會加上一個空格（范圍從 ' 1' 到 '31'）
  • %g - 和 %G 一樣，但是沒有世紀
  • %G - 4 位數的年份，符合 ISO 星期數（參見 %V）。和 %V 的格式和值一樣，只除了如果 ISO 星期數屬于前一年或者后一年，則使用那一年。
  • %h - 和 %b 一樣
  • %H - 24 小時制的十進制小時數（范圍從 00 到 23）
  • %I - 12 小時制的十進制小時數（范圍從 00 到 12）
  • %j - 年份中的第幾天，十進制數（范圍從 001 到 366）
  • %m - 十進制月份（范圍從 01 到 12）
  • %M - 十進制分鐘數
  • %n - 換行符
  • %p - 根據給定的時間值為 `am' 或 `pm'，或者當前區域設置中的相應字符串
  • %r - 用 a.m. 和 p.m. 符號的時間
  • %R - 24 小時符號的時間
  • %S - 十進制秒數
  • %t - 制表符
  • %T - 當前時間，和 %H:%M:%S 一樣
  • %u - 星期幾的十進制數表達 [1,7]，1 表示星期一
  • %U - 本年的第幾周，從第一周的第一個星期天作為第一天開始
  • %V - 本年第幾周的 ISO 8601:1988 格式，范圍從 01 到 53，第 1 周是本年第一個至少還有 4 天的星期，星期一作為每周的第一天。（用 %G 或者 %g 作為指定時間戳相應周數的年份組成。）
  • %W - 本年的第幾周數，從第一周的第一個星期一作為第一天開始
  • %w - 星期中的第幾天，星期天為 0
  • %x - 當前區域首選的時間表示法，不包括時間
  • %X - 當前區域首選的時間表示法，不包括日期
  • %y - 沒有世紀數的十進制年份（范圍從 00 到 99）
  • %Y - 包括世紀數的十進制年份
  • %Z 或 %z - 時區名或縮寫
  • %% - 文字上的 `%' 字符 

例如：　

1
2
3
4
<?php
$config['date'] = '%I:%M %p';
$smarty->assign('config', $config);
?>

正常頁面中的

1
2
3
{$smarty.now|date_format}
{$smarty.now|date_format:"%D"}
{$smarty.now|date_format:$config.date}

根據上面的字母提示可以算出輸出信息。

 

 

Smarty自帶了一些內置函數，這些內置函數是Smarty模板引擎的組成部分。他們被編譯成相應的內嵌PHP代碼，以獲得最大性能。

您創建的自定義函數不能與內置函數同名，也不必修改這些內置函數。

其中一些具有assign屬性，用來收集函數結果，并將結果分配給一個命名的模板變量，而不是將內容輸出，類似于{assign}函數。

一、{if}{elseif}{else} 條件

隨著一些特性加入到模版引擎，Smarty的{if}語句與php的if語句一樣富有彈性。每一個{if}必須與一個{/if}成對出現，允許使用{else}和{elseif}，所有php條件和函數在這里同樣適用，諸如||、or、&&、and、is_array()等等。

如果開啟安全，只支持符合$php_functions的安全策略屬性的php函數。
下面是一串有效的限定符，它們的左右必須用空格分隔開，注意列出的清單中方括號是可選的，在適用情況下使用相應的等號（全等或不全等）。

（1）{if}語句（開頭結尾不要忘記）

先要在php頁面引入“入口文件”，寫入“變量注冊方法”和“模板顯示方法”

1
2
3
4
5
6
7
<?php
include("../init.inc.php");  //引入的入口文件
 
 
$smarty->assign("name",10);  //變量注冊方法assign()
 
$smarty->display("test.html");  //模板顯示方法display()

然后是html頁面的條件了

1
2
3
4
5
6
7
<!--開頭if-->
<{if $name == 10}>  <!--如果$name等于10-->
 
<div style="width:100px; height:100px; "></div> <!--這個div的顏色是紅色-->
 
<!--結尾if-->
<{/if}>

看下結果

修改一下php文件中的注冊值

1
$smarty->assign("name",11);

那么這個div就不會顯示了，因為條件是$name等于10的時候才會顯示紅色

（2）{if}...{else}語句　

php頁面還是上面的例子，不同的是html頁面加了一個“否則”的語句

1
2
3
4
5
6
7
8
<!--開頭if-->
<{if $name == 10}>    <!--如果$name等于10，這個div就是紅色-->
<div style="width:100px; height:100px; "></div>
<!--否則-->
<{else}>    <!--否則這個div是粉色-->
<div style="width:100px; height:100px; "></div>
<!--結尾if-->
<{/if}>

剛開始在php中name的值是“10”，所以也看到了顏色是紅色；現在我們把name的值成隨便一個數，那么html中的如果就不會成立，那么就會出現“否則”的顏色

注意：上面的那個表中相對的“備用詞”也是可以用的。

二、{foreach},{foreachelse}遍歷

（1）同樣，要先寫php文件，既然是遍歷，那么我們可以用數組

1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
include("../init.inc.php");
 
$arr = array(
    array("001","中國"),
    array("002","淄博"),
    array("003","濟南"),
    array("004","濟寧"),
);
 
$smarty->assign("shuzu",$arr);
 
$smarty->display("test.html");

（2）然后就是寫html頁面了，{foreach}也是雙標簽啊，這里使用下拉列表顯示出來的

1
2
3
4
5
6
7
<select>
        <{foreach $shuzu as $v}>
                <option value="<{$v[0]}>"><{$v[1]}></option>
        <{/foreach}>
         
</select>
        

看下顯示結果

（3）嵌套了key的{foreach}

php頁面沒有任何變換，變換的是html頁面

不同的是as后面的代碼

1
2
3
4
5
<select>
　　<{foreach $shuzu as $k=>$v}>   <!--不同之處就是$k=>$v-->
　　　　<option value="<{$v[0]}>"><{$k}><{$v[1]}></option>
　　<{/foreach}>      
</select>

這樣就是顯示出代號了

（4）@index

包含當前數組的下標，開始時為0。

同樣的將html頁面中的key進行修改

1
2
3
4
5
<select>
        <{foreach $shuzu as $v}>
                <option value="<{$v[0]}>"><{$v@index }><{$v[1]}></option>
        <{/foreach}>
</select>

效果是同樣的

同樣的還有一些差不多的

@iteration  ：iteration包含當前循環的迭代，總是以1開始，這點與index不同。每迭代一次值自動加1。

@first  ：當{foreach}循環第一個時first為真。這里我們演示當第一次迭代表格頭所在行。

三、編輯器插件

這個就是關于編輯器的文件：

根據提示可以修改任何的參數對編輯器進行修改

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<?php
 
　　/**
     * 編輯器
     * @param int $textareaid
     * @param int $toolbar    有basic full 和desc三種
     * @param int $color 編輯器顏色
     * @param string $alowuploadexts 允許上傳類型
     * @param string $height 編輯器高度
     * @param string $disabled_page 是否禁用分頁和子標題
　　*/
　　function smarty_block_textarea($args, $content, $smarty, &$repeat) {
　　//public static function editor($textareaid = 'content', $toolbar = 'basic', $height = 200, $color = '', $up=true) {
 
　　if(!$repeat) {   
    $textareaid = !empty($args['name']) ? $args['name'] : 'content';
    $toolbar = !empty($args['toolbar']) ? $args['toolbar'] : 'basic';
    $height = !empty($args['height']) ? $args['height'] : '200';
    $color = !empty($args['color']) ? $args['color'] : '';
    $up = !empty($args['up']) ? $args['up'] : true;
             
 
     
    $str ='<textarea name="'.$textareaid.'">'.$content.'</textarea>';
    if(!defined('EDITOR_INIT')) {
        $str .= '<script type="text/javascript" src="../js/ckeditor/ckeditor.js"></script>';
        define('EDITOR_INIT', 1);
    }
     
    if($toolbar == 'basic') {
        $toolbar = "['Bold', 'Italic','Underline','Strike','NumberedList', 'BulletedList', 'TextColor','BGColor', 'Link', 'Unlink', '-', 'Image','Flash','Table','Smiley','SpecialChar'],['RemoveFormat'],
           \r\n";
    } elseif($toolbar == 'full') {
        $toolbar = "['Source','-','Templates'],
        ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print'],
        ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],['ShowBlocks'],['Image','Capture','Flash'],['Maximize'],
        '/',
        ['Bold','Italic','Underline','Strike','-'],
        ['Subscript','Superscript','-'],
        ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
        ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
        ['Link','Unlink','Anchor'],
        ['Table','HorizontalRule','Smiley','SpecialChar'],
        '/',
        ['Styles','Format','Font','FontSize'],
        ['TextColor','BGColor'],
        ['attachment'],\r\n";
           
    } elseif($toolbar == 'desc') {
        $toolbar = "['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink', '-', 'Image', '-','Source'],\r\n";
         
    } else {
        $toolbar = '';
    }
    $str .= "<script type=\"text/javascript\">\r\n";
    $str .= "CKEDITOR.replace( '$textareaid',{";
 
    $str .= "height:{$height},";
     
     
    if($color) {
        $str .= "extraPlugins : 'uicolor',uiColor: '$color',";
    }
    /*
    if($up) {  
        $str .="filebrowserImageUploadUrl:'".B_URL."/upimage',";
        $str .="filebrowserFlashUploadUrl:'".B_URL."/upflash',";
    } */
    $str .= "toolbar :\r\n";
    $str .= "[\r\n";
    $str .= $toolbar;
    $str .= "]\r\n";
    //$str .= "fullPage : true";
    $str .= "});\r\n";
    $str .= '</script>';
    return $str;
　　}
　　}

可以顯示出編輯器來看下，同樣的在html文件中寫

1
2
3
<{textarea}>
         
<{/textarea}>

這樣就可以加載出編輯框了

（1）在上面的插件中有這么一句注釋

1
* @param int $toolbar    有basic full 和desc三種

這樣是可以直接在html中進行修改編輯框顯示的功能，將toolbar的值改成“full”

1
2
3
<{textarea name='uid' toolbar='full'}>
         
<{/textarea}>

看下結果：比沒有改值的時候的功能多了點

通過一些參數還可以修改其他的樣式：比如顏色，那么就在后面加上

1
color='#F0F'

就可以變成想要的顏色


文章列表


不含病毒。www.avast.com
arrow
arrow
    全站熱搜
    創作者介紹
    創作者 大師兄 的頭像
    大師兄

    IT工程師數位筆記本

    大師兄 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄