Photoshop: What is High Dynamic Range and How Do Y...
What is dynamic range? According to that great source of public information, Wikipedia, i...

Make A Simple Shoutbox / Chatroom Part 1...
This tutorial explains how to use PHP to make a shoutbox or chat room for your site. Part ...

Creating Photoshop Website Templates...
Creating Photoshop website templates tutorials is a good start for beginners who have a li...

Creating a Website Design Templating System Using ...
Learn how to create a website design templating system using php to be able to easily upda...

The Benefits of Search Engine Optimization...
We have all heard of the importance of SEO when it comes to getting your website known in ...

Join The WebmasterStash Community Today! - It's FREE!

(If you were logged in you wouldn't be seeing these adverts. Login or Register Now!)

Creating a Template Engine


	Submitted By Staff On 15th Dec 2007 - 10:08am :: Report Tutorial :: Go Back to Tutorial Listings

In this tutorial I will show you the basics of a template engine.
Template engines are brilliant for separating content from design from code. This allows you to keep the same content format and just change the template and voila your content is in a new template.

For the purpose of this tutorial I'm not going to use a proper template but just a simple tabled layout, below is the template I've used:

<html>
<head>
<title>My Template Engine</title>
</head>

<body>

<table width='100%' cellspacing='2' cellpadding='1'>
<tr>
<td colspan='2'>
<h1>Template Engine Example</h1>
</td>
</tr>
<tr>
<td width='25%' align='left' valign='top'>
{MENU}
</td>

<td width='75%' valign='top'>
{CONTENT}
</td>
</tr>
</table>

</body>
</html>

From the code above you may notice {MENU} and {CONTENT}. These are references so the engine will know where it needs to place your menu and content.
Save this as "layout.tpl".

Now we have our template, create a new php file and inside place the following code:

<strong>Site Navigation</strong><br />
-<a href='index.php'>Homepage</a><br />
-<a href='index.php?content=about'>About Us</a>

Save this as "menu.tpl".
This will serve as your menu that will be placed where it says {MENU} in your template.
Now we need to create content for your homepage and for the about us page.

Heres what I've got.

<h1>Welcome...</h1>
This is my homepage. Some content could go here describing my site.<br /><br />

Hope you like it!

Save the content for your homepage as "home.tpl"
Now for the about us.

<h1>About Us</h1>
This is the about us page.<br />
Information about you or your site could go here!<br /><br />

Hope you like it!

Save the about us page as "about.tpl".
On the next page we will cover the juicy bits of php that make the template engine tick.


	« 1 2 3 »