剛開始接觸模版引擎的 PHP 設計師,聽到 Smarty 時,都會覺得很難。其實筆者也不例外,碰都不敢碰一下。但後來在剖析 XOOPS 的程式架構時,開始發現 Smarty 其實並不難。只要將 Smarty 基礎功練好,在一般應用上就已經相當足夠了。當然基礎能打好,後面的進階應用也就不用怕了。
這篇文章的主要用意並非要深入探討 Smarty 的使用,這在官方使用說明中都已經寫得很完整了。筆者僅在此寫下一些自己使用上的心得,讓想要了解 Smarty 卻不得其門而入的朋友,可以從中得到一些啟示。就因為這篇文章的內容不是非常深入,會使用 Smarty 的朋友可能會覺得簡單了點。
目前本文已經第三次修訂了,本想多加一些料進來;不過礙於時間的關係,很多 Smarty 的進階技巧筆者並沒有研究得很透徹,所以也不敢拿出來現眼,但筆者我相信這篇文章應該要能滿足大多數想學 Smarty 的初學者了。當然本文有謬誤的地方也歡迎告知,筆者會在下次的修訂中更正的。
Smarty介紹
什麼是模版引擎
不知道從什麼時候開始,有人開始對 HTML 內嵌入 Server Script 覺得不太滿意。然而不論是微軟的 ASP 或是開放原始碼的 PHP,都是屬於內嵌 Server Script 的網頁伺服端語言。因此也就有人想到,如果能把程式應用邏輯 (或稱商業應用邏輯) 與網頁呈現 (Layout) 邏輯分離的話,是不是會比較好呢?
其實這個問題早就存在已久,從互動式網頁開始風行時,不論是 ASP 或是 PHP 的使用者都是身兼程式開發者與視覺設計師兩種身分。可是通常這些使用者不是程序強就是美工強,如果要兩者同時兼顧,那可得死掉不少腦細胞...
所以模版引擎就應運而生啦!模版引擎的目的,就是要達到上述提到的邏輯分離的功能。它能讓程式開發者專注於資料的控製或是功能的達成;而視覺設計師則可專注於網頁排版,讓網頁看起來更有專業感!因此模版引擎很適合該公司的網站開發團隊使用,使每個人都能發揮其專長!
就筆者接觸過的模版引擎來說,依資料呈現方式大概分成:需搭配程序處理的模版引擎和完全由模版本身自行決定的模版引擎兩種形式。
在需搭配程式處理的模版引擎中,程式開發者必須要負責變數的呈現邏輯,也就是說他必須把變數的內容在輸出到模版前先處理好,才能做 assign 的工作。換句話說,程式開發者還是得多寫一些程式來決定變數呈現的風貌。而完全由模版本身自行決定的模版引擎,它允許變數直接 assign 到模版中,讓視覺設計師在設計模版時再決定變數要如何呈現。因此它可能會有另一套屬於自己的模版程式語法 (如 Smarty) ,以方便控制變數的呈現。但這樣一來,視覺設計師也得學習如何使用模版語言。
模版引擎的運作原理,首先我們先看看以下的運作圖:
一般的模版引擎 (如 PHPLib) 都是在建立模版物件時取得要解析的模版,然後把變數套入後,透過 parse() 這個方法來解析模版,最後再輸出網頁。
對 Smarty 的使用者來說,程式裡也不需要做任何 parse 的動作了,這些 Smarty 自動會幫我們做。而且已經編譯過的網頁,如果模版沒有變動的話, Smarty 就會自動跳過編譯的動作,直接執行編譯過的網頁,節省編譯的時間。
使用Smarty的一些概念
在一般模版引擎中,我們常看到區域的觀念,所謂區塊大概都會長成這樣:
區域內容
這些區塊大部份都會在 PHP 程式中以 if 或 for, while 來控制它們的顯示狀態,雖然模版看起來簡潔多點了,但只要一換了顯示方式不同的模版, PHP 程式勢必要再改一次!
在 Smarty 中,一切以變數為主,所有的呈現邏輯都讓模版自行控制。因為 Smarty 會有自己的模版語言,所以不管是區塊是否要顯示還是要重複,都是用 Smarty 的模版語法 (if, foreach, section) 搭配變數內容作為呈現。這樣一來覺得好像模版變得有點複雜,但好處是只要規劃得當, PHP 程式一行都不必改。
由上面的說明,我們可以知道使用Smarty 要掌握一個原則:將程式應用邏輯與網頁呈現邏輯明確地分開。就是說 PHP 程式裡不要有太多的 HTML 碼。程式中只要決定好那些變數要塞到模版裡,讓模版自己決定該如何呈現這些變數 (甚至不出現也行) 。
Smarty的基礎
安裝Smarty
首先,我們先決定程式放置的位置。
Windows下可能會類似這樣的位置:「 d:appservwebdemo 」。
Linux下方可能會類似這樣的位置:「 /home/jaceju/public_html/ 」。
到Smarty的官方網站下載最新的Smarty套件:http://smarty.php.net。
解開 Smarty 2.6.0 後,會看到許多檔案,其中有個 libs 資料夾。在 libs 中應該會有 3 個 class.php 檔 + 1 個 debug.tpl + 1 個 plugin 資料夾 + 1 個 core 資料夾。然後直接將 libs 複製到您的程式主資料夾下,再更名為 class 就可以了。就這樣?沒錯!這種安裝法比較簡單,適合一般沒有自己主機的使用者。
至於 Smarty 官方手冊中為什麼要介紹一些比較複雜的安裝方式呢?基本上依照官方的方式安裝,可以只在主機安裝一次,然後提供給該主機下所有設計者開發不同程式時直接引用,而不會重複安裝太多的 Smarty 複本。而筆者所提供的方式則是適合要把程式帶過來移過去的程式開發者使用,這樣不用煩惱主機有沒有安裝 Smarty 。
程式的資料夾設定
以筆者在Windows安裝Appserv為例,程式的主資料夾是「d:appservwebdemo」。安裝Smarty後,我們在主資料夾下再建立這樣的資料夾:
在 Linux 底下,請記得將 templates_c 的權限變更為 777 。 Windows 下則將其唯讀取消。
第一個用Smarty寫的小程式
我們先設定 Smarty 的路徑,請將以下這個檔案命名為 main.php ,並放置到主資料夾下:
main.php:
include "class/Smarty.class.php";
define(@#__SITE_ROOT@#, @#d:/appserv/web/demo@#); // 最後沒有斜線
$tpl = new Smarty();
$tpl = new Smarty();
$tpl->template_dir = __SITE_ROOT . "/templates/";
->config_dir = __SITE_ROOT . "/configs/";
$tpl->cache_dir = __SITE_ROOT . "/cache/";
$tpl->left_ptpl-> ->right_delimiter = @#}>@#;
?>
照上面方式設定的用意在於,程式如果要移植到其它地方,只要改 __SITE_ROOT 就可以囉。 (這裡是參考 XOOPS 的 )
Smarty 的模版路徑設定好後,程式會依照這個路徑來抓所有模版的相對位置 (範例中是 @#d:/appserv/web/demo/templates/@# ) 。然後我們用 display() 這個 Smarty 方法來顯示我們的模版。
接下來我們在 templates 資料夾下放置一個 test.htm:(擴展名叫什麼都無所謂,但便於視覺設計師開發,筆者都還是以 .htm 為主。)
templates/test.htm :
$tpl s_dir =c__SITE_OT .
$tpl->config_dir = __SITE_ROOT . "/configs/";
$tpl->cache_dir = __SITE_ROOT . "/cache/"; >;
$tpl->right_delimiter = @#}>@#;
?>
modules 這個資料夾則是用來放置程式模組的,如此一來就不會把程式丟得到處都是,整體架構一目了然。都只要將這個檔案包含進來就可以啦。 。
從變數開始
如何使用變數
從上一章範例中,我們可以清楚地看到我們利用 這兩個標示符號將變數包起來。預設的標示符號為 { 及 } ,但為了中文沖碼及 javascript 的關係,因此筆者還是模仿 XOOPS ,將標示符號換掉。變數的命名方式和 PHP 的變數命名方式是一模一樣的,前面也有個 $ 字號 (這和一般的模版引擎不同)。標示符號就有點像是 PHP 中的
(事實上它們的確會被替換成這個) ,所以以下的模版變數寫法都是可行的:
1.
2.
3. }>
在 Smarty 裡,變數預設是全域的,也就是說你只要指定一次就好了。指定兩次以上的話,變數內容會以最後指定的為主。就算我們在主模版中載入了外部的子模版,子模版中同樣的變數一樣也會被替代,這樣我們就不用再針對子模版再做一次解析的動作。
而在 PHP 程式中,我們用 Smarty 的 assign 來將變數置放到模版上。 assign 的用法官方手冊中已經寫得很多了,用法就如同上一節的範例所示。不過在重複區塊時,我們就必須將變數做一些手腳後,才能將變數 assign 到模版中,這在下一章再提。
修飾你的變數
上面我們提到 Smarty 變數所呈現的風貌是由模版自行決定的,所以 Smarty 提供了許多修飾變數的函數。使用的方法如下:
範例如下:
好,那為什麼要讓模版自行決定變數呈現的風貌?先看看底下的 HTML ,這是某個購物車結帳的部份畫面。
總金額:21,000 元
一般模版引擎的模版可能會這樣寫:
總金額:{format_total} value="{total}" />
總金額:{format_total} 元
它們的 PHP 程式中要這樣寫:
$tpl->assign("total", $total);
$tpl->assign("format_total", number_format($total));
>?的模版就可以這樣寫: (number_format 修飾函式請到Smarty 官方網頁下載)
" />
總金額: 元
Smarty 的 PHP 程式只要這樣寫:
$total = 21000; total", $total);
?>
所以在 Smarty 中我們只要指定一次變量,剩下的交給模版自行決定即可。這樣了解了嗎?這就是讓模版自行決定變數呈現風貌的好處!
控制模版的內容
重複的區塊
在 Smarty 樣板中,我們要重複一個區塊有兩種方式: foreach 及 section 。而在程式中我們則要 assign 一個數組,這個數組可以包含數組數組。就像下面這個例子:
首先我們來看看 PHP 程式是如何寫的:
test2.php:
require "main.php";
$array1 =$ array 。 >$array2 = array(
array("index1" => "data1-1", "index2" => "data1-2", "index3" => "data1-3"),
array( "index1" => "data2-1", "index2" => "data2-2", "index3" => "data2-3"),
array("index1" => "data3-1", "index2" => "data3-2", "index3" => "data3-3"),
array("index1" => "data4-1", "index2" => "data4-2", "index3" => "data4-3"),
array("index1" => "data5-1", "index2" => "data5-2", "index3" => "data5-3") );
$tpl->assign("array2", $array2);
$tpl->display("test2.htm");
?>
而模版的寫法如下:
templates/test2.htm:
重複區塊 <br>利用 foreach 來呈現 array1 <br> <br> <br>利用 section 呈現 array1 <br> <br> }> <br> <br>利用 foreach 來呈現 array2 <br> <br> <br>: <br> <br> <br>使用 section 來呈現 array1 <br>{section name=sec2 loop=$array2}> <br>index1: <br>index2: <br>index3: <br> <br>
登入後複製
執行上例後,我們發現不管是 foreach或 section 兩個執行結果是一樣的。那麼兩者到底有何不同呢?
第一個差異很明顯,就是foreach 要以巢狀處理的方式來呈現我們所 assign 的兩層數組變量,而 section 則以「主數組[循環名稱].子數組索引」即可將整個數組呈現出來。由此可知, Smarty 在模版中的 foreach 和 PHP 中的 foreach 是相同的;而 section 則是 Smarty 為了處理如上所列的陣列變數所發展出來的敘述。當然 section 的功能還不止於此,除了下一節所談到的巢狀資料呈現外,官方手冊中也提供了好幾個 section 的應用範例。
不過要注意的是,丟給 section 的陣列索引必須是從 0 開始的正整數,即 0, 1, 2, 3, ...。如果您的陣列索引不是從 0 開始的正整數,那麼就得改用 foreach 來呈現您的資料。您可以參考官方討論區的此篇討論,其中探討了 section 和 foreach 的用法。
巢狀資料的呈現
模版引擎裡最令人傷腦筋的大概就是巢狀資料的呈現吧,許多著名的模版引擎都會特意強調這點,不過這對 Smarty 來說卻是小兒科。
最常見到的巢狀資料,就算論譠程序中的討論主題區吧。假設要呈現的結果如下:
公告區
站務公告
文學專區
好書介紹
奇文共賞
電腦專區
硬體外圍
軟體討論
程式中我們先以靜態資料為例:
test3.php:
require "main.php";
$forum = array(
array(" category_id" => 1, "category_name" => "公告區",
"topic" => array(
array("topic_id" =>產出1, >)
),
array("category_id" => 2, "category_name" => "文學專區",
"topic" , "topic_name" => "好書介紹"),
array("topic_id" => 3, "topic_name" => "奇文共賞")
)
),y
("category_id" => 3, "category_name" => "電腦區",
"topic" => array(
array("topic_id => array(
array("topic_id => 4, "to_name" ,
array("topic_id" => 5, "topic_name" => "軟體討論")
)
)
)); forum);
$tpl->display("test3.htm");
?>
模版的寫法如下:
templates/test3.htm:
巢狀循環測試 執行的結果就像筆者舉的例子。
因此呢,在程式中我們只要想辦法把所要重複值一層一層的塞到數組中,再利用 這樣的方式來顯示每一個巢狀循環中的值。至於用什麼方法呢?下一節使用資料庫時我們再提。
轉換資料庫中的資料
上面提到如何顯示巢狀循環,而實際上應用時我們的資料可能是從資料庫中抓取出來的,所以我們就得想辦法把資料庫的資料變成上述的多重數組的形式。這裡筆者用一個 DB 類別來抓取資料庫中的資料,您可以自行用您喜歡的方法。
我們只修改 PHP 程序,模版還是上面那個 (這就是模版引擎的好處~),其中 $db 這個對象假設已經在 main.php 中建立好了,而且抓出來的資料就是上面的例子。
test3.php:
require "main.php";
// 先建立第一層陣列
$category = array();
$db
->setSQL($SQL1, @#CATEGORY@#);
if (!$db->query(@#CATEGORY@#)) die($db->error());
// 抓取第一層迴圈的資料
while ($item_category = $db->fetchAssoc(@#CATEGORY@#))
{
// 建立第二層陣列();
$db->setSQL(sprintf($SQL2, $item_category[@#category_id@#]), @#TOPIC@#);
if (!$db->query(@#TOPIC @#)) die($db->error());
// 抓取第二層循環的資料
while ($item_topic = $db->fetchAssoc(@#TOPIC@#))))
{
// 把抓取的資料推入第二層陣列中
array_push($topic, $item_topic);
}
// 把第二層陣列指定為第一層數組所抓取的資料中的一個成員
$item_category[@#topic@#] = $topic;
// 把第一層資料推入第一層數組中
array_push($category, $item_category);
}
$tpl->assign("forum", $category);
$tpl->display("test3.htm"); ?>
在資料庫抓取一筆資料後,我們得到的是一個包含該筆資料的陣列。透過 while 敘述及 array_push 函數,我們將資料庫中的資料一筆一筆地塞到陣列裡。如果只用到單層循環,就把第二層循環 (紅色的部份) 去掉即可。
決定內容是否顯示
要決定是否要顯示內容,我們可以使用 if 這個文法來做選擇。例如如果使用者已經登入的話,我們的模版就可以這樣寫:
顯示使用者操作選擇單
顯示輸入帳號與密碼的窗體
要注意的是,「==」號兩邊一定要各留至少一個空格符,否則 Smarty 會無法解析。
if 語法一般的應用可以參考官方使用說明,所以筆者在這裡就不詳加介紹了。不過筆者發現了一個有趣的應用:常常會看到程式裡要產生這樣的一個表格: (數字代表的是資料集的順序)
1 2
3 4
5 6
7 8
這個筆者稱之為「橫向重複表格」。它的特色和傳統的縱向重複不同,前幾節我們看到的重複表格都是從上而下,一列只有一筆資料。而橫向重複表格則可橫向地在一列中產生 n 筆資料後,再換下一列,直到整個循環結束。要達到這樣的功能,最簡單的方式只需要 section 和 if 搭配即可。
我們來看看下面這個範例:
test4.php:
require "main.php";
$my_array = array(
array("value" => "0"),
array("value" => "1"),
array("value" => "2"),
array("value" => "2"),
array("value" => "3" ),
array("value" => "4"),
array("value" => "5"),
array("value" => "6"),
array("value" => "6"),
array("value" => "7"),
array("value" => "8"),
array("value" => "9"));
$tpl-> assign("my_array", $my_array);
$tpl->display(@#test4.htm@#);
?>
模版的寫法如下:
templates/test4.htm:s/test4.htm:
橫向重複表格測驗 重點在於 $smarty.section.sec1.rownum 這個Smarty 變量,在 section 循環中這個變數會取得從 1 開始的索引值,所以當 rownum 能被 2 除盡時,就輸出
使表格換列 (注意!是
在前面
在後面) 。因此數字 2 就是我們在一列中想要呈現的資料筆數。各位可以由此去變化其它不同的呈現方式。
載入外在內容
我們可以在模版內載入 PHP 程式碼或是另一個子模版,分別是使用 include_php 及 include 這兩個 Smarty 模版查詢官方 include_php 筆者使用手冊,使用較少方法可以使用官方手冊,這裡不再敘述。
在使用 include 時,我們可以預先載入子模版,或是動態載入子模版。預先載入通常使用在有共同的文件標頭及版權宣告;而動態載入則可以用在統一的框架頁,而進一步達到如 Winamp 般可換 Skin 。當然這兩種我們也可以混用,視狀況而定。
我們來看看下面這個範例:
test5.php:
require "main.php";
$tpl->assign("title", "Include 測試測試測試");
$tpl->assign("content", "這是模版 2 中的變數");
$tpl->assign("dyn_page", "test5_3.htm");
$tpl->display(@#test5_1.htm@#);
?>
模版 1 的寫法如下:
templates/test5_1.htm:
模版 2 的寫法如下:
templates/test5_2.htm:
模版 3 的寫法如下:
templates/test5_3.htm:
這是模版 3 的內容
模版 4 的寫法如下: templates/test5_4.htm: }>
這裡注意幾個重點:1. 模版的位置都是以先前定義的 template_dir 為基準;2. 所有 include 進來的子模版中,其變數也會被解譯。用「變數名稱=變數內容」來指定引進的模版所包含的變量,如同上面模版 4 的做法。
以上就介紹了smart flash recovery 菜鳥學PHP之Smarty入門,包括了smart flash recovery方面的內容,希望對PHP教程有興趣的朋友有所幫助。