<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5" />
<title>Smarty 入門</title>
<style type="text/css">
<!--
ol {
font-size: 12pt;
}
.chapter {
color: #003399;
font-size: 12pt;
font-weight: bold;
}
.section {
color: #003399;
}
.content {
font-size: 12pt;
color: #666666;
font-weight: normal;
}
.filename {
font-family: "Courier New";
font-size: 10pt;
font-weight: bold;
color: #003366;
}
.code {
font-family: "Courier New";
font-size: 10pt;
font-weight: normal;
color: #000000;
border: 1px solid #663300;
background-color: #FFFFCC;
margin: 5px;
padding: 0px;
display: table;
}
.code-comment {
color: #009900;
}
.image {
text-align: center;
}
.subject {
font-weight: bold;
font-size: 16pt;
}
.author {
font-size: 12pt;
}
.important {
color: #CC3300;
}
.title {
font-size: large;
}
a:link {
font-size: 12pt;
color: #000000;
}
a:visited {
font-size: 12pt;
color: #000000;
}
a:hover {
font-size: 12pt;
color: #333333;
}
ol.menu {
font-size: 10pt;
}
a.menu:link {
font-size: 10pt;
color: #000000;
}
a.menu:visited {
font-size: 10pt;
color: #000000;
}
a.menu:hover {
font-size: 10pt;
color: #333333;
}
.menu {
background-color:#CCCCCC;
}
-->
</style>
<script language="JavaScript1.2">
<!--
var speed = 20;
var Xpos = 240;
var Ypos = 420;
function setInit()
{
posX = (document.body.clientWidth - Xpos)
posY = (document.body.clientHeight - Ypos)
}
function Renew(div_id)
{
document.all[div_id].style.left = posX + (document.body.scrollLeft);
document.all[div_id].style.top = posY + (document.body.scrollTop);
}
function goMove(x)
{
div_id = x.id;
func = "Renew('" + div_id + "')";
setInit();
window.onresize = setInit;
markID = setInterval(func, speed);
}
//-->
</script>
</head>
<body>
<div id="doc_menu" style="position:absolute; filter: alpha(opacity=40);">
<table width="230" border="0" cellpadding="3" cellspacing="0" class="menu">
<tr>
<td align="center" class="subject">Smarty 入門</td>
</tr>
<tr>
<td align="center" class="author">作者:Jace Ju</td>
</tr>
<tr>
<td>
<ol type="A" class="menu">
<li><a href="#A" class="menu">Smarty介紹</a></li>
<ol class="menu">
<li><a href="#A01" class="menu">什麼是樣版引擎</a></li>
<li><a href="#A02" class="menu">樣版引擎的運作原理</a></li>
<li><a href="#A03" class="menu">使用Smarty的一些概念</a></li>
</ol>
<li><a href="#B" class="menu">Smarty的基礎</a></li>
<ol class="menu">
<li><a href="#B01" class="menu">安裝Smarty</a></li>
<li><a href="#B02" class="menu">程式的資料夾設定</a></li>
<li><a href="#B03" class="menu">第一個用Smarty寫的小程式</a></li>
<li><a href="#B04" class="menu">如何安排你的程式架構</a></li>
</ol>
<li><a href="#C" class="menu">從變數開始</a></li>
<ol class="menu">
<li><a href="#C01" class="menu">如何使用變數</a></li>
<li><a href="#C02" class="menu">修飾你的變數</a></li>
</ol>
<li><a href="#D" class="menu">控制樣版的內容</a></li>
<ol class="menu">
<li><a href="#D01" class="menu">重覆的區塊</a></li>
<li><a href="#D02" class="menu">巢狀資料的呈現</a></li>
<li><a href="#D03" class="menu">轉換資料庫中的資料</a></li>
<li><a href="#D04" class="menu">決定內容是否顯示</a></li>
<li><a href="#D05" class="menu">載入外部內容</a></li>
<!-- <li><a href="#D06" class="menu">其他有趣的應用</a></li> -->
</ol>
<!-- <li><a href="#E" class="menu">Smarty 進階 Methods 的應用</a></li> -->
<!-- <li><a href="#F" class="menu">撰寫自己的 Smarty Plugin</a></li> -->
</ol>
</td>
</tr>
<tr>
<td align="right"><a href="#TOP" class="menu">回頁首</a></td>
</tr>
</table>
</div>
<!--呼叫Java浮動表格特效的敘述-->
<script language="JavaScript">
<!--
document.onload = goMove(document.all.doc_menu);
//-->
</script>
<a name="TOP" id="TOP"></a>
<table width="75%" border="0" cellpadding="3" cellspacing="0">
<tr>
<td>
<div align="center" class="title">Smarty 入門</div>
<div>序言</div>
<p class="content">剛開始接觸樣版引擎的 PHP 設計師,聽到 Smarty 時,都會覺得很難。其實筆者也不例外,碰都不敢碰一下。但是後來在剖析 XOOPS 的程式架構時,開始發現 Smarty 其實並不難。只要將 Smarty 基礎功練好,在一般應用上就已經相當足夠了。當然基礎能打好,後面的進階應用也就不用怕了。</p>
<p class="content">這篇文章的主要用意並非要深入探討 Smarty 的使用,這在官方使用說明中都已經寫得很完整了。筆者僅在此寫下一些自己使用上的心得,讓想要了解 Smarty 卻不得其門而入的朋友,可以從中得到一些啟示。就因為這篇文章的內容不是非常深入,會使用 Smarty 的朋友們可能會覺得簡單了點。</p>
<p class="content">目前本文已經第三次修訂了,本想多加一些料進來;不過礙於時間的關係,很多 Smarty 的進階技巧筆者並沒有研究得很透徹,所以也不敢拿出來現眼,但筆者相信這篇文章應該能夠滿足大多數想學習 Smarty 的初學者了。當然本文有謬誤的地方也歡迎告知,筆者會在下一次的修訂中更正的。</p>
<!-- <p class="content">目前本文已經第四次改版了,修改與新增的內容有: <a href="http://www.twbb.org">TWBB</a> 站長 - FIEND 、 <a href="http://www.kmd.com.tw">網路甘仔店</a> 站長 - Dannis 等兩位加持。在這裡筆者由衷地感謝他們兩位的指導與建議,當然各位朋友們有任何疑惑的話,都可以到他們的網站做更詳細的討論。</p> -->
<p class="content">P.S. 請在 1024 x 768 的環境下看會比較好。</p>
<p class="content" align="right"><a href="mailto:jaceju@seed.net.tw">jaceju@seed.net.tw</a> 2004/02/09</p>
<ol type="A">
<a name="A" id="A"></a>
<br />
<li class="chapter">Smarty介紹</li>
<ol>
<a name="A01" id="A01"></a>
<br />
<li class="section">什麼是樣版引擎</li>
<p class="content">不知道從什麼時候開始,有人開始對 HTML 內嵌入 Server Script
覺得不太滿意。然而不論是微軟的 ASP 或是開放源碼的 PHP,都是屬於內嵌 Server Script
的網頁伺服端語言。因此也就有人想到,如果能把程式應用邏輯 (或稱商業應用邏輯) 與網頁呈現 (Layout) 邏輯分離的話,是不是會比較好呢?</p>
<p class="content">其實這個問題早就存在已久,從互動式網頁開始風行時,不論是 ASP 或是 PHP
的使用者都是身兼程式開發者與視覺設計師兩種身份。可是通常這些使用者不是程式強就是美工強,如果要兩者同時兼顧,那可得死掉不少腦細胞...</p>
<p class="content">所以樣版引擎就應運而生啦!樣版引擎的目的,就是要達到上述提到的邏輯分離的功能。它能讓程式開發者專注於資料的控制或是功能的達成;而視覺設計師則可專注於網頁排版,讓網頁看起來更具有專業感!因此樣版引擎很適合公司的網站開發團隊使用,使每個人都能發揮其專長!</p>
<p class="content">就筆者接觸過的樣版引擎來說,依資料呈現方式大概分成:需搭配程式處理的樣版引擎和完全由樣版本身自行決定的樣版引擎兩種形式。</p>
<p class="content">在需搭配程式處理的樣版引擎中,程式開發者必須要負責變數的呈現邏輯,也就是說他必須把變數的內容在輸出到樣版前先處理好,才能做
assign 的工作。換句話說,程式開發者還是得多寫一些程式來決定變數呈現的風貌。而完全由樣版本身自行決定的樣版引擎,它允許變數直接 assign 到樣版中,讓視覺設計師在設計樣版時再決定變數要如何呈現。因此它就可能會有另一套屬於自己的樣版程式語法
(如 Smarty) ,以方便控�
评论2