Templates can improve the structure of your site. This article explains how to use templates to control page layouts in a Web site composed of a large number of static HTML pages through a new feature and template class in PHP 4.
Outline:
===================================
Detach functionality and layout
Avoid page element duplication
Template framework for static web sites
===================================
Detach functionality and layout
First, let's take a look at the two main purposes of applying the template:
Detach function (PHP) and layout (HTML)
Avoid page element duplication
The first is to talk about the most, and it envisions a scenario where a group of programmers write PHP scripts to generate page content, while another group of designers design HTML and graphics to control the final appearance of the page. The basic idea of separating functions and layouts is to enable both groups to write and use separate sets of files: programmers only care about files that contain only PHP code, without caring about the appearance of the page, and page designers can design page layouts with their most familiar visual editors, No need to worry about breaking any PHP code embedded in the page.
If you've ever seen a few tutorials about PHP templates, you should already understand how the templates work. Consider a simple part of the page: the top of the page is the header, the left is the navigation bar, and the rest is the content area. This web site can have the following template files:
<!--main.htm-->
<body>
<table><tr><td>{HEADER}</td></tr>
<tr><td>{LEFTNAV}</td><td>{CONTENT}</td></tr>
</table>
</body>
<!--header.htm-->
<!--leftnav.htm-->
<br><a href= "foo" >Foo</a>
<br><a href= "Bar" >Bar</a>
You can see how pages are constructed from these templates: The main template controls the layout of the entire page; header templates and LeftNav templates control the common elements of the page. The identifier inside the curly brace "{}" is a content placeholder. The main advantage of using templates is that interface designers can edit them as they wish, such as setting fonts, modifying colors and graphics, or completely changing the layout of a page. Interface designers can edit these pages with any normal HTML editor or Visual tool, because they contain only HTML code and no PHP code. The PHP code is saved in a separate file, which is the file that is actually called by the page URL. The Web server parses the file through the PHP engine and returns the results to the browser. Generally, PHP code always dynamically generates page content, such as querying a database or performing some sort of calculation. Here is an example:
<?php
example.php
Require (' class. Fasttemplate.php ');
$TPL = new Fasttemplate ('. ');
$TPL->define Array (' main ' => ' main.htm '),
' Header ' => ' header.htm ',
' LeftNav ' => ' leftnav.htm '));
The PHP code here is set $content to include the appropriate page content
$tpl->assign (' CONTENT ', $content);
$tpl->parse (' header ', ' header ');
$tpl->parse (' LeftNav ', ' leftnav ');
$TPL->parse (' main ', ' main ');
$tpl->fastprint (' MAIN ');
?>
Here we are using the popular Fasttemplate template class, but the basic idea is the same for many other template classes. First you instantiate a class, tell it where to find the template file and which template file corresponds to which part of the page, then generate the page content, give the result the identifier of the content, then, in turn, parse each template file, the template class will perform the necessary substitution operations, and finally output the parsing results to the browser.
This file is composed entirely of PHP code, does not contain any HTML code, this is its biggest advantage. Now, PHP programmers can focus on writing the code that generates the page content without having to worry about how to generate HTML to properly format the final page.
You can use this method and the above file to construct a complete Web site. If the PHP code is based on the query string in the URL to generate the page content, such as http://www.foo.com/example.php?article=099, you can construct a complete magazine website accordingly.
It is easy to see that there is a second advantage to using templates. As shown in the example above, the navigation bar on the left side of the page is saved as a single file, and we can change the navigation bar to the left of all pages of the site by simply editing the template file. Avoid page element duplication
"It's really good," You might think, "My site is mostly composed of a lot of static pages." Now that I can remove their public parts from all the pages, it's too much trouble to update the public parts. In the future, I can create a unified page layout that is easy to maintain with templates. "But things are not so simple," a lot of static pages say the problem lies.
Please consider the above example. This example actually has only one example.php page, and it is able to generate all the pages of the entire site because it uses the query string in the URL to dynamically construct the page from information sources such as databases.
Most of us are running websites that don't necessarily have database support. Most of our site is composed of static pages, and then use PHP here, there are some dynamic features, such as search engines, feedback forms. So how do you apply a template on such a Web site?
The easiest way to do this is to copy a PHP file for each page, and then set the variables in the PHP code that represent the content in each page to the appropriate page content. For example, suppose you have three pages that are home, about (about), and products (product), and we can generate them separately with three files. The contents of these three files are as follows:
<?php
home.php
Require (' class. Fasttemplate.php ');
$TPL = new Fasttemplate ('. ');
$TPL->define Array (' main ' => ' main.htm '),
' Header ' => ' header.htm ',
' LeftNav ' => ' leftnav.htm '));
$content = "<p> Welcome to visit </p>
<p> hope you can enjoy this website </p> ";
$tpl->assign (' CONTENT ', $content);
$tpl->parse (' header ', ' header ');
$tpl->parse (' LeftNav ', ' leftnav ');
$TPL->parse (' main ', ' main ');
$tpl->fastprint (' MAIN ');
?>
Obviously, there are three problems with this approach: we have to replicate these complex, template-related PHP code for each page, which is as difficult to maintain as repeating common page elements; now the files are mixed with HTML and PHP code; Assigning values to content variables becomes very difficult, Because we have to deal with a lot of special characters.
The key to solving this problem is to separate the PHP code from the HTML content, although we can't remove all the HTML content from the file, but we can move out most of the PHP code. Template framework for static web sites
First, we write template files for all the common elements of the page as well as the overall layout of the page, and then remove the public parts from all the pages, leaving only the content of the page, followed by adding three lines of PHP code to each page, as follows:
<?php
<!--home.php-->
<?php require (' prepend.php ');?>
<?php Pagestart (' home ');?>
<p> Welcome Visit </p>
<p> hope you can enjoy this website </p>
<?php pagefinish ();?>
?>
This approach basically solves the various problems mentioned earlier. Now there are only three lines of PHP code in the file, and no single line of code is directly involved in the template, so it's very unlikely to change the code. In addition, because the HTML content is outside the PHP tag, there is no special character handling problem. We can easily add these three lines of PHP code to all static HTML pages.
The Require function introduces a PHP file that contains all of the required PHP code associated with the template. Where the Pagestart function sets the template object and the page title, the Pagefinish function parses the template and then generates the results to the browser.
How did this happen? Why is the HTML in the file not sent to the browser before calling the Pagefinish function? The answer is a new feature of PHP 4 that allows you to intercept output to a browser in a buffer. Let's look at Prepend.php's specific code:
<?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 ');
}
The?> Pagestart function first creates and sets a template instance, and then enables output caching. Thereafter, all HTML content from the page itself will go into the cache. The Pagefinish function takes out the contents of the cache and then specifies the contents in the template object, finally parsing the template and outputting the completed page.
This is the entire template framework of the whole process of work. First write the template that contains the common elements of each page of the site, and then remove all the common page layout codes from all the pages and replace them with three lines of PHP code that never changes. and add the Fasttemplate class file and prepend.php to the include path, so you get a Web site where the page layout can be centrally controlled, it has better reliability and maintainability, and extensive changes at the site level become quite easy.
This download package contains a running example Web site with code comments that are more detailed than the previous code comments. The Fasttemplate class can be found in http://www.thewebmasters.net/, the latest version number is 1.1.0, and there is a small patch to keep the class running correctly in PHP 4. The class in the download code for this article has been modified by the patch.