The Concept of Template |
出自LifeType 中文文件計畫
模版如何運作?
前面提到過,LifeType使用Smarty引擎來產生網誌的網頁內容。也就意味著使用者可以輕易的在後台管理介面中,更換模版改變網頁的外觀。但,模版是如何運作?使用者又該如何製作屬於自己的模版呢?
開始之前必須先知道的是,所有的模版存放在LifeType架構中的哪一個位置。LifeType的模版是存放在*templates/*之下,在這個資料夾中,除了網誌可以使用的模版之外,還包含了後台頁面(admin)、摘要頁面(summary)、安裝精靈(wizard)、RSS feed頁面(rss)以及郵件通告(misc)等模版。
LifeType預設的網誌模版有三個,分別是standard、grey與blueish。以grey模版為例,在grey資料夾中,我們可以看到以下的*.template文件檔:
- commentarticle.template
- commentform.template
- demosites.template
- error.template
- features.template
- footer.template
- header.template
- main.template
- post.template
- postandcomments.template
- posttrackbacks.template
- samplerss.template
- album.template
- albums.template
- resource.template
- searchresults.template
在這16個*.template文件檔中,以粗體表示的是最基本的模版,也是必須存在的模版。這9個模版更是網誌運作與呈現不可缺少的。以下簡述9個檔案的基本功能:
- main.template:這個檔案控制網誌的主頁面。
- postandcomments.template:這個檔案控制網誌文章內容與迴響內容的呈現。
- commentarticle.template:這個檔案主要用來顯示新增(或回覆)迴響時的表單。
- posttrackbacks.template:用來顯示網誌文章的所有引用資訊。
- error.template:顯示錯誤訊息用。
- album.template:顯示資源中心資料夾下的檔案。
- albums.template:與上述檔案不同之處,這個檔案室用來顯示資源中心裡所有最上層的資料夾。
- resource.template:用來顯示檔案詳細資料。
- searchresults.template:顧名思義,就是用來顯示網誌中搜尋結果。
看到這,或許有人會懷疑,既然只需要9個模版檔案即可,那為何又多出7個額外的檔案?這7個檔案或許不起眼,但卻是修改模版中不可缺的幫手,有了這7個檔案,讓模版的修改更加容易。
上述9個主要模版檔案中,每一個檔案都必須有完整的網頁結構,才能讓網誌正常運作。而這些網頁呈現所需的結構,有部分是一再重複的。在製作模版的過程中,如果要讓每個頁面有相同的頁首與頁尾,沒別的辦法,只能重複的執行「複製、貼上」的動作9次。若不幸中途做了點修改,那又得回頭去「複製、貼上」。
幸好,Smarty允許使用{include...}標籤在當案中匯入另一個檔案,只要在標籤中加上參數「file」,並設定好匯入檔案的路徑即可。有了這樣的功能,在製作或修改模版的時候,我們只需將會重複使用的部分寫成一個檔案,再利用{include...}標籤將其匯入LifeType的主要模版之中。
以頁首與頁尾為例子,若所有模版均使用相同的頁首(header)與頁尾(footer),那麼模版開發者只需將頁首頁尾的部分另外寫成header.template與footer.template兩個檔案,再用{include...}標籤匯入到主要的模版檔案中,方法如下:
{include file="$blogtemplate/header.template"}
...
模版內容
...
{include file="$blogtemplate/footer.template"}有一點須注意的是,{include...}標籤中使用的路徑是相對於templates/ 資料夾的。另外,也可以使用$blogtemplate變數來表示templates/底下各個模版資料夾的名稱,這樣一來就算模版資料夾更名或搬移,也不會影響模版的運作。
利用這樣的方式,當我們修改模版頁首的呈現時,只需針對header.template修改一次,即可達到全部修改的目的。也因此,才會出現 commentform.template、post.template等檔案的出現。而這些模版中,我們已經知道header.template與 footer.template,分別控制頁面的頁首與頁尾呈現,在此簡單敘述commentform.template與post.template這兩個檔案的作用:
- commentform.template:這個檔案主要包含了提交迴響的表格,因為也具有可重複使用的特性,因此將其獨立出來,再以匯入的方式工其他檔案使用。一般來說,這個檔案常用在postandcomments.template之中。
- post.template:這個檔案主要包含了網誌的文章內容,一般來說,這個檔案常用在main.template與postandcomments.template之中。
(以上摘譯改寫自 LifeType英文wiki文件,下方Smarty如何產生php頁面的圖解與說明,改寫自Mark Wu的0.32 版教學投影片。)
說完了LifeType模版的基本結構,那這些模版究竟是如何運作,成為最後呈現在網頁上面的樣子?以下借用Jace Ju的Smarty入門中的Smarty樣版引擎運作示意圖,來說明LifeType模版的運作流程。 圖片連結:http://forum.lifetype.org.tw/index.php?action=dlattach;topic=1552.0;id=89;image