現在網絡上已經到處可以看到使用模板開發出來的網站。使用模板開發網站有很多好處,最主要的就是模板與程序完全脫離,用戶可以根據規定好的標簽任意開發模板,導入到模板引擎里就能正常運行。所以美工人員跟程序編寫人員徹底的獨立了。提高了開發網站的效率,程序的重用性發揮的淋漓盡致。
智能建站系統、速成網站、自助建站系統、只會打字就能做網站,等等廣告字眼我們已經不再陌生了,所有的這些無非都是圍繞著模板做文章。也正是因為這樣的系統越來越普及,對于要求不高的企業或者個人用戶,擁有一個完全屬于自己的網站,用現成的模板要比找網絡公司定制省錢的多。性價比要高的多,所以目前中小型網絡公司的生存問題堪憂。
提供模板做論壇的discuz公司,各位站長應該都很熟悉,但是做企業網站、獨立購物網系統,國內做的比較好的幾家公司,想必大家可能不太熟悉:ShopEx 、 攜購網店系統(ShopXG) 、HiShop 、 狼煙網絡(mynet.cn) 等等,大家有機會可以去他們的官網看看各自的優勢。
下面我們來詳細講解下如何開發網站模板。
涉及到模板的部分我們可以分成以下幾塊:自定義標簽、模板文件、數據控制項、模板引擎
1. 自定義標簽 自定義標簽是模板文件與模板引擎之間交互的基礎,也可以說是協議。 目前網絡上普遍的標簽樣式為:{$****} {#*****#},這樣的表示方法,主要是為了區分html等腳本標簽。 標簽的內容區可以設置多種屬性。比如len=100 表示數據長度不超過100個字節。 標簽變量根據不同的類型,我們可以把名稱規定為如下方式:
{$var_**} 變量標簽,表示這個標簽的數據來源是某一個字段的值
{$const_**} 常量標簽,表示這個標簽是一個常量數據,比如,當前的日期等
{$temp_small} 小模板數據。(什么叫小模板,我們在后面詳細講解)
{$page_**} 分頁數據。例如首頁,上頁,下頁等翻頁的代碼部分。等等。
舉例:{$var_news_title len=30} 表示顯示新聞的標題,如果新聞標題的字數超過 30個字,那么截取。
2.模板文件
模板文件就是由美工人員開發的腳本代碼,里面不涉及到任何程序。由于數據經常會涉及到一個循環顯示的問題,所以我們把模板文件又分成:大模板、小模板。
模板文件一般都是普通的html文件,源代碼里包含了事先約定好的自定義標簽,
圖標說明每個模塊的共性: 圖1:新聞列表
圖2:產品列表
大家看上面兩個模塊,一個是新聞列表,一個是產品列表。無論從數據類型還是展現方式上乍一看截然不同。
但是大家仔細的看一下,很容易看出來他們其實有很多共同的特點--他們都是有大模板(模塊的外框部分)、小模板(模塊的數據循環部分)組成。另外,大家可以去找個網站分解下看看。是不是都可以把他們分解成不同的模塊,然后每個模塊又可以分成大模板、小模板組成。
我們以上圖中新聞列表來給大家講解下:
大模板文件就是整個外框部分。基本html如下面所示:
<div class=”newslist”>
<h>攜購網店 – 不可多得的創業好項目</h>
<ul>代理商加盟攜購之后能得到什么?!</ul>
<div>{$temp_small}</div>
</div>
從上面可以看出,大模板文件里并沒有涉及到數據部分,只有一個小模板標簽{$temp_small} ,當模板引擎解析到這個標簽的時候,將對應的小模板文件解析后,用最終生成的html數據將該標簽替換掉。
接下來,我們來看一下小模板的組成:
這里特別需要注意下,當模板引擎在解析小模板的時候,是把小模板的數據當作一個循環體,說明白些:比如有10條新聞,那么模板引擎將循環10次小模板數據,將具體的新聞內容分別去替換小模板里的標簽,然后組合成一個最終的html.
小模板的腳本部分:
<ul clas=”small_item”>
<li>{$var_news_title len=100}</li>
<li>{$var_news_add_time}</li>
</ul>
當然,需要分頁的時候,還需要做分頁模板,解析引擎會解析分頁模板后,將查詢到的當前數據替換掉對應的分頁變量標簽,最后,替換掉大模板中的分頁模板標簽。
分頁的腳本部分舉例:
<a href="{$var_link_firstpage_link}" id="modulelist_linkup_first">首頁</a>
<a href="{$var_link_ {$var_link_pageteam} <a href="{$var_link_nextpage_link}" id="modulelist_linkup_next">下一頁</a>
<a href="{$var_link_lastpage_link}" id="modulelist_linkup_last">末頁</a>總數:{$var_link_totalnum} 每頁條數:{$var_link_perpagecnt}
總頁數:{$var_link_totalpage}當前頁碼:{$var_link_curpagenum}/{$var_link_totalpage}
最后從結構上我們再總結下模板的組成關系:
3.數據控制部分
該部分是要將哪些數據展示在模板數據項的核心。主要包括以下幾部分:
a. 查詢條件 ,從數據庫里要查出哪些數據。
b. 排序類型, 將查詢得到的數據,通過何種方式進行排序展示。
c. 當前頁碼, 跟每頁顯示條數配合使用,
d. 每頁顯示條數。
e. 是否忽略URL地址里傳過來的參數,這個項非常重要,因為像分頁和查詢,他們都需要從url將參數傳過來,而有些定死的數據又不希望受到url參數的影響,所以該項在控制數據顯示方面尤為重要。
f. 接受url的參數列表。等等.
有了數據控制部分,才能讓相同類型的模塊展示不同的數據。
4. 模板引擎
我們知道模板文件是靜態的html腳本頁面,它并不具有業務操作能力,單純的模板沒有任何存在的意義。需要模板引擎通過數據控制將獲取到的數據按照模板文件規定的樣式展示出來,
模板引擎的好壞,直接影響到整個程序的性能,模板要跟數據庫打交道,由于模板文件有非常多的數據冗余,而且,設計不合理的模板,同個頁面可能需要多次相同的數據庫查詢操作,如果模板引擎不能很好的區分出來。那么對數據庫的壓力也是非常大的。
如果大家對開發模板網站有興趣,強烈推薦去用下攜購公司開發的VTEditor可視化網站模板開發系統。官方網站:http://www.shopxg.com .是目前唯一真正實現可視化模板編輯的系統。
歡迎大家與我交流。QQ:8814730 Email:8814730@qq.com
新聞熱點
疑難解答