How to wrap your web site around the script
You may have noticed the HTML header, and HTML footer panels in your admin panel, and said to yourself "How do I use these?". Well, let me see if I can clear things up a bit.
There are two different methods which you can use which you have already read about, using the content boxes to enter HTML, or using the content boxes to point to an external PHP/HTML file.
This document will assist you in understanding how to setup tables, regardless of which of the two methods you use, to wrap your content around the script.
When a page is loaded in the script, we check the database to see if there is anything in the header/footer to be displayed. If there is, we send it out to the browser for rendering/parsing before the script itself processes it's output.
So, knowing that here's what the script would look like if you placed content in those panels. Items you entered into the header panel, would appear in the green box below. Items you entered into the footer panel, would appear in the red box below.
Pretty easy so far.
But what if you wanted to add a column to the left hand side? Well, for that we need to visualize the space we have, and create it within a table. Take the following diagrams into consideration where the space in gray is the script itself:
"Yes, yes! That's what I want" you say. It's easy to do.
What we need to do, is to create a master table to hold everything. In the four following examples, I will outline what you need to put into the header, and then footer box to achieve each of the 4 layouts shown above.
Layout 1:
Top content area, left content area
Header Box
<table width="100%" border="0" cellspacing="0" cellpadding="3">
<tr>
<td colspan="2">
INSERT YOUR DESIRED HEADER CONTENT HERE
</td>
</tr>
<tr>
<td width="YOUR DESIRED COLUMN WIDTH">
INSERT YOUR DESIRED LEFT COLUMN CONTENT HERE
</td>
<td>
Footer Box
</td>
</tr>
</table>
Layout 2:
Top content area, left content area, right content area
Header
<table width="100%" border="0" cellspacing="0" cellpadding="3">
<tr>
<td colspan="3">
INSERT YOUR DESIRED HEADER CONTENT HERE
</td>
</tr>
<tr>
<td width="YOUR DESIRED COLUMN WIDTH">
INSERT YOUR DESIRED LEFT COLUMN CONTENT HERE
</td>
<td>
Footer
</td>
<td width="YOUR DESIRED COLUMN WIDTH">
INSERT YOUR DESIRED RIGHT COLUMN CONTENT HERE
</td>
</tr>
</table>
Layout 3:
Top content area, right content area
Header
<table width="100%" border="0" cellspacing="0" cellpadding="3">
<tr>
<td colspan="2">
INSERT YOUR DESIRED HEADER CONTENT HERE
</td>
</tr>
<tr>
<td>
Footer
</td>
<td width="YOUR DESIRED COLUMN WIDTH">
INSERT YOUR DESIRED RIGHT COLUMN CONTENT HERE
</td>
</tr>
</table>
Layout 4:
Top content area, left content area, right content area, bottom content area
Header
<table width="100%" border="0" cellspacing="0" cellpadding="3">
<tr>
<td colspan="3">
INSERT YOUR DESIRED HEADER CONTENT HERE
</td>
</tr>
<tr>
<td width="YOUR DESIRED COLUMN WIDTH">
INSERT YOUR DESIRED LEFT COLUMN CONTENT HERE
</td>
<td>
Footer
</td>
<td width="YOUR DESIRED COLUMN WIDTH">
INSERT YOUR DESIRED RIGHT COLUMN CONTENT HERE
</td>
</tr>
<tr>
<td colspan="3">
INSERT YOUR DESIRED FOOTER CONTENT HERE
</td>
</tr>
</table>
That's all there is to it! With these basic guidelines in place, you should be able to wrap your existing web site around the script.