用PHP製作靜態網站的模板架構

來源:互聯網
上載者:User


模板能夠改善網站的結構。本文闡述如何通過PHP 4的一個新功能和模板類,在由大量靜態HTML頁面構成的網站中巧妙地運用模板控制頁面配置。

提綱:

===================================

分離功能和布局

避免頁面元素重複

靜態網站的模板架構

===================================

分離功能和布局

首先我們來看看應用模板的兩個主要目的:

分離功能(PHP)和布局(HTML)

避免頁面元素重複

第一個目的是談論得最多的目的,它設想的情形是:一組程式員編寫用於產生頁面內容的PHP指令碼,同時另一組設計人員設計HTML和圖形以控制頁面的最終外觀。分離功能和布局的基本思想就是使得這兩組人能夠各自編寫和使用獨立的一組檔案:程式員只需關心那些只包含PHP代碼的檔案,無需關心頁面的外觀;而頁面設計人員可以用自己最熟悉的可視化編輯器設計頁面配置,無需擔心破壞任何嵌入到頁面的PHP代碼。

如果你曾經看過幾個關於PHP模板的教程,那麼你應該已經明白模板的工作機制。考慮一個簡單的頁面局部:頁面的上方是頁頭,左邊是導航條,其餘部分是內容地區。這種網站可以擁有如下模板檔案:

<!-- main.htm -->
<html>
<head><title>模板樣本</title></head>
<body>
<table><tr><td>{HEADER}</td></tr>
<tr><td>{LEFTNAV}</td><td>{CONTENT}</td></tr>
</table>
</body></html>

<!-- header.htm -->
<img src="sitelogo.jpg">

<!-- leftnav.htm -->
<br><a href="foo">Foo</a>
<br><a href="bar">Bar</a>

可以看出頁面如何由這些模板構造而成:main模板控制著整個頁面的布局;header模板和leftnav模板控制著頁面的公用元素。花括弧“{}”裡面的標識符是內容預留位置。使用模板最主要的好處在於介面設計者能夠按照自己的意願編輯這些檔案,比如設定字型、修改顏色和圖形,或者完全地改變頁面的布局。介面設計者可以用任何普通HTML編輯器或者視覺化檢視編輯這些頁面,因為這些檔案都只包含HTML代碼,沒有任何PHP代碼。
PHP代碼全部儲存到單獨的檔案中,這個檔案也就是由頁面URL實際調用的檔案。Web伺服器通過PHP引擎解析該檔案,然後把結果返回給瀏覽器。一般地,PHP代碼總是動態地產生頁面內容,比如查詢資料庫或者執行某種計算等。下面是一個例子:
<?php

// example.php
require('class.FastTemplate.php');
$tpl = new FastTemplate('.');
$tpl->define( array( 'main' => 'main.htm',
'header' => 'header.htm',
'leftnav' => 'leftnav.htm' ) );

// 此處的PHP代碼設定$content使其包含合適的頁面內容

$tpl->assign('CONTENT', $content);
$tpl->parse('HEADER', 'header');
$tpl->parse('LEFTNAV', 'leftnav');
$tpl->parse('MAIN', 'main');
$tpl->FastPrint('MAIN');

?>

這裡我們使用的是流行的FastTemplate模板類,但其基本思路對於其他許多模板類來說都一樣。首先你執行個體化一個類,告訴它到哪裡去尋找模板檔案以及哪一個模板檔案與頁面的哪部分對應;接下來是產生頁面內容,把結果賦予內容的標識符;然後,依次解析各個模板檔案,模板類將執行必要的替換操作;最後把解析結果輸出到瀏覽器。

這個檔案完全由PHP代碼構成,不包含任何HTML代碼,這是它最大的優點。現在,PHP程式員可以集中精力編寫產生頁面內容的代碼,而不必為了如何產生HTML去正確地格式化最終頁面而擔心。

你可以使用這種方法和上面的檔案構造出一個完整的網站。如果PHP代碼是以URL中的查詢字串為基礎產生頁面內容,例如http://www.foo.com/example.php?article=099,你可以據此構造出一個完整的雜誌網站。

很容易看出採用模板還有第二個好處。如上例所示,頁面左邊的導航條單獨儲存為一個檔案,我們只需編輯這一個模板檔案就可以改變網站所有頁面左邊的導航條。
避免頁面元素重複
“這確實不錯”,你也許會想,“我的網站主要就是由大量的靜態頁面構成。現在我可以從所有頁面中刪除它們的公用部分,要更新這些公用部分實在太麻煩了。以後我就可以用模板製作出很容易維護的統一頁面配置。”但事情並非這麼簡單,“大量的靜態頁面”道出了問題的所在。

請考慮上面的例子。這個例子實際上只有一個example.php頁面,它之所以能夠產生整個網站的所有頁面,是因為它利用了URL中的查詢字串從資料庫之類的資訊源動態地構造出頁面。

我們之中的大多數人所啟動並執行網站並不一定都有資料庫支援。我們的網站大多數由靜態頁面構成,然後用PHP在這裡、那裡加上一些動態功能,比如搜尋引擎、反饋表單等。那麼,如何在這種網站上應用模板呢?

最簡單的方法是為每一個頁面複製一份PHP檔案,然後在每一個頁面中把PHP代碼裡代表內容的變數設定成合適的頁面內容。例如,假設有三個頁面,它們分別是首頁(home)、關於(about)和產品(product),我們可以用三個檔案分別產生它們。這三個檔案的內容都類如:

<?php

// home.php
require('class.FastTemplate.php');
$tpl = new FastTemplate('.');
$tpl->define( array( 'main' => 'main.htm',
'header' => 'header.htm',
'leftnav' => 'leftnav.htm' ) );

$content = "<p>歡迎訪問</p>
<img src=\"demo.jpg\">
<p>希望你能夠喜歡本網站</p>";
$tpl->assign('CONTENT', $content);
$tpl->parse('HEADER', 'header');
$tpl->parse('LEFTNAV', 'leftnav');
$tpl->parse('MAIN', 'main');
$tpl->FastPrint('MAIN');

?>

顯然,這種方法有三個問題:我們必須為每一個頁面複製這些複雜的、牽涉到模板的PHP代碼,這與重複公用頁面元素一樣使得頁面難以維護;現在檔案又混合了HTML和PHP代碼;為內容變數賦值將變得非常困難,因為我們必須處理好大量的特殊字元。

解決這個問題的關鍵就在於分離PHP代碼和HTML內容,雖然我們不能從檔案中刪除所有的HTML內容,但可以移出絕大多數PHP代碼。
靜態網站的模板架構

首先,我們象前面一樣為所有的頁面公用元素以及頁面整體布局編寫模板檔案;然後從所有的頁面刪除公用部分,只留下頁面內容;接下來再在每個頁面中加上三行PHP代碼,如下所示:

<?php

<!-- home.php -->
<?php require('prepend.php'); ?>
<?php pageStart('Home'); ?>

<h1>你好</h1>
<p>歡迎訪問</p>
<img src="demo.jpg">
<p>希望你能夠喜歡本網站</p>

<?php pageFinish(); ?>

?>

這種方法基本上解決了前面提到的各種問題。現在檔案裡只有三行PHP代碼,而且沒有任何一行代碼直接涉及到模板,因此要改動這些代碼的可能性極小。此外,由於HTML內容位於PHP標記之外,所以也不存在特殊字元的處理問題。我們可以很容易地將這三行PHP代碼加入到所有靜態HTML頁面中。

require函數引入了一個PHP檔案,這個檔案包含了所有必需的與模板相關的PHP代碼。其中pageStart函數設定模板對象以及頁面標題,pageFinish函數解析模板然後產生結果發送給瀏覽器。

這是如何?的呢?為什麼在調用pageFinish函數之前檔案中的HTML不會發送給瀏覽器?答案就在於PHP 4的一個新功能,這個功能允許把輸出到瀏覽器的內容截獲到緩衝區之中。讓我們來看看prepend.php的具體代碼:

<?php

require('class.FastTemplate.php');

function pageStart($title = '') {
GLOBAL $tpl;
$tpl = new FastTemplate('.');
$tpl->define( array( 'main' => 'main.htm',
'header' => 'header.htm',
'leftnav'=> 'leftnav.htm' ) );
$tpl->assign('TITLE', $title);
ob_start();
}

function pageFinish() {
GLOBAL $tpl;
$content = ob_get_contents();
ob_end_clean();
$tpl->assign('CONTENT', $content);
$tpl->parse('HEADER', 'header');
$tpl->parse('LEFTNAV', 'leftnav');
$tpl->parse('MAIN', 'main');
$tpl->FastPrint('MAIN');
}

?>
pageStart函數首先建立並設定了一個模板執行個體,然後啟用輸出緩衝。此後,所有來自頁面本身的HTML內容都將進入緩衝。pageFinish函數取出緩衝中的內容,然後在模板對象中指定這些內容,最後解析模板並輸出完成後的頁面。

這就是整個模板架構全部的工作過程了。首先編寫包含了網站各個頁面公用元素的模板,然後從所有頁面中刪除全部公用的頁面配置代碼,代之以三行永遠無需改動的PHP代碼;再把FastTemplate類檔案和prepend.php加入到包含路徑,這樣你就得到了一個頁面配置可以集中控制的網站,它有著更好的可靠性和可維護性,而且網站級的大範圍修改也變得相當容易。

本文下載包包含了一個可啟動並執行樣本網站,它的代碼注釋要比前面的代碼注釋更詳細一些。FastTemplate類可以在http://www.thewebmasters.net/找到,最新的版本號碼是1.1.0,那裡還有一個用於保證該類在PHP 4中正確啟動並執行小補丁。本文下載代碼中的類已經經過該補丁的修正。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.