Web Template System

This is a simple web templating system in PHP. I originally created it for a few web sites that I administer, including the Computer Science Graduate Council at Virginia Tech. It is now in use at Uma Murthy's home page and at the Scholars of the Future program. Because of interest in this template system from others, here it is!

Download
Archive

Free for non-commercial use with attribution.
Donations appreciated!

More Information

A simple, easy-to-deploy web template system.
Designed for static web sites.
Original logo Photoshop files are available for easy editing.
Colors can be customized easily.
Completely CSS-based; no table-based layouts.
Fully XHTML 1.0 and CSS 3.0 compliant.

Step-by-Step Instructions to Deploy

Confirm that your webserver runs PHP. This is simple to do:
1. Create a new file named "phpinfo.php" in your web server dirctory.
2. Open it in a text editor and add the following text to it.
```
<?php phpinfo(); ?>
```
3. Enter the URL to this file in your web browser: http://localhost/phpinfo.php
4. If you see the complete configuration details of your PHP installation, PHP is installed and configured correctly. If you see the exact text you entered, you will need to install PHP for your system first.
Make a new directory and call it whatever you want. "YourNewWebsite" is as good a name as any.
Copy all the files from the template system into that directory.
Open config.php in a text editor, and edit the $root variable in it to point to the virtual path of the directory. This is what you would type in a browser after the http://localhost to get to the web directory. Remember not to include a trailing slash in it.

To create a new page, simply create a new PHP file, and add the following to it:

<?php
  $title = "Your New Page";
  require_once("theme/template.header.php");
?>

<h1>
<Your Content Goes Here>

<?php
  require_once("theme/template.footer.php");
?>

If you create subdirectories, make sure to adjust the path in the require_once() statements. It can accept relative paths, so you might end up with a statement like:
```
require_once("../../theme/template.footer.php");
```
for a page in a directory that is two-levels deep. (I.e., within http://localhost/YourNewWebsite/dir/subdir/page.php).
Link to it as you would link to any other page.
That's it!

More Customizations

Setting the $title

Make sure you set the $title variable, because that's what will appear in the <title> part of the page. This also helps search engines index your page better.

Navigation Menus

To create menu items on the left side of the page, add links to navigation.php. There are two CSS classes available, Menu and SubMenu. This lets you create two-level menu structures. (And anything more than two is too much anyway, from a usability point of view!)

Theme

To customize the colors, you can edit the theme. Theme-related files are available in the /theme subdirectory. To keep it simple, themes cannot be edited or set via a web interface, and only one theme is supported at one time. To use another theme, you must replace the template.header.php, template.footer.php and base.css files.

Colors

If you simply want to change the colors instead of the entire theme, just edit base.css and set the colors you'd like to use.

Logos

Logos are available in the /images subdirectory, along with the original Photoshop files used to create them. To edit them, open the .psd files in Photoshop, and edit them as you see fit. When you're done, save the .psd, and also Save As a png file. The web browser will not use the .psd file, so if you do not export and overwrite the existing .png file, you will continue to set the original logo.

Advanced Configuration

If you have permissions to alter the .htaccess configuration, and/or if you are able to alter the Apache configuration via httpd.conf, you can enter the following line in either of them:

Options +MultiViews

This will allow you to link to PHP files without including the .php extension in URLs. So your pages would be accessed as http://localhost/YourNewWebsite/your-page instead of http://localhost/YourNewWebsite/your-page.php. This is a good thing since it makes your URLs independent of the specific technology you're using.

Support

If you need assistance deploying this, please send me an email.