ucms.php - Styles and Templates

As a page is built (using buildPages.php), if it's template Layout is not 0, parts of the page will be assembled as indicated in the template.

Around each zone of the page, a css '<div>' tag.

Within the file database.php, the functions ucBuildBody and ucBuildZone read the page and it's template and construct the page, saving it to the '/output' directory under the sites main directory.

The code as is, separates parts of a page into areas and these are also named using '<div>'.

The whole page is wrapped with <div id='wrapper'>.

The top of a page is wrapped with <div id='banner'>.

The main menu of a page is wrapped with <div id='mainNavW'>.

The rest of a page is wrapped with <div id='contentWrapper'>.

Within 'contentWrapper, there are divs for the body of the page followed any Left and right columns (main, LeftColumn and RightColumn).

The Template has a zone for each piece of the page, 0 is the header of a page (logo banner etc).

1,2 and 3 are for any portion of a left column.

4,5 and 6 are for any portion of a right column.

7 is for any portion that follows the body of a page (a footer between the columns etc.)

8 names the body portion of the text (8 will always be the body or content of the page, but here you can name it differently for different .css styles).

9 is for any footer that is placed after the main content, left and right columns.

Although this scheme evolved to create .css based pages, by altering the functions in database.php, you are free to use whatever system works for your sites.

All of the items within a template are placed in the page surrounded a 'div' that has the same name as the item.

If one template has a panel in the left column called 'Extra' then within any style sheet, you can add instructions to style the 'Extra' section within your pages.

Code within ucBuildBody and ucBuildZone also adds 'div' markers for the active page and possibly area/sub-directory. This allows us to add style instructions to the .css file to high light the current page or area in the menus.

A menu of pages in the current area/directory if the template zone is called 'Index'.

Both main and any area menus are output as un-ordered lists and can be styled using the appropriate .css code.

The best way to see all of this in action is to view one of these pages in 'plain text' or as source and also the 'styles.css' file (www.linesofcode.co.uk/styles.css).

Here is the code produced using an empty template type 4 (left and right columns on)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<meta name="KEYWORDS" content="" />
<meta name="DESCRIOPION" content="" />
<link href="../styles.css" rel="stylesheet" type="text/css" />
<link href="../linesofcode.css" rel="stylesheet" type="text/css" />
<meta name="ROBOTS" content="INDEX,FOLLOW" />
<meta name="resource-type" content="document" />
<meta http-equiv="expires" content="0" />
<meta name="author" content="Phillip Sibson" />
<meta name="copyright" content="Copyright (c) 2007 by Phillip Sibson" />
<meta name="revisit-after" content="1 days" />
</header>

<body><div id="wrapper">
<div id="banner">
</div id="banner">
<div id="mainNavW">
<ul id="mainNav"><li><a href="../index.html">LinesOfCode</a></li><li><a href="../test.html">test</a></li><li id="zActive" ><a href="../ucms/index.html">ucms.php</a></li></ul></div id="mainNavW">
<div id="contentWrapper">
<div id="main">
<div id="">


</div>
</div id="main">
<div id=LeftColumn>

</div id=LeftColumn>

<div id=RightColumn>

</div id=RightColumn>

<div id="Footer"></div>

</div id="contentWrapper">

</div id="wrapper">
</body>

</html>