[Tutorial] Easy site layout
Here I will be explaining how to make an really nice looking layout with less fuss.
OK we are going to learn how to do a Simple PHP code which is really simple.
OK Example www.animegfx.net
I use PHP includes on my site Basicly a PHP Include is a line of code that you can add a file into a PHP Document. So say you do this
www.animegfx.net/top.php
This is the top and left hand side of the main page index.
www.animegfx.net/bottom.php
this is the right side and Bottom part of the main Page.
How did I get this to work you ask?
Well First thing first you need to make your site. Really simple layout is a Table layout if you do something simple it will work OK so lets try something simple
Open up your favorate text editors or if you have a webdevelopment program like DreamWeaver
Now we are going start off with something like
Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
body,td,th {
color: #000000;
}
body {
background-color: #999999;
}
a:link {
color: #333333;
}
a:visited {
color: #333333;
}
a:hover {
color: #333333;
}
a:active {
color: #333333;
}
-->
</style></head>
<body>
<div align="center"></div>
<table width="800" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
<tr>
<td><img src="logo.gif" width="800" height="150"></td>
</tr>
<tr>
<td height="236" valign="top" bordercolor="#000000"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="22%" height="233">A little nave stuff gose over here </td>
<td width="54%">
Now Save this page as top.php
We are going to do the bottom now
Open a new document and put this code in
Code:
</td>
<td width="24%">More Nave stuff gose over here </td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
Now save this file as bottom.php
Now your top should look something like this.
http://www.animegfx.net/top.jpg
And the bottom should look something like this.
http://www.animegfx.net/bottom.jpg
OK Now time for the Main Content of the site
This is really simple Seeing as your top has the open tag for the center table and your Bottom.php has the closeing tag all you have to do is the fallowing
Code:
<? include('top.php'') ?>
Content gose here
<? include ('bottom.php') ?>
Save this file as index.php
And your finished product should look like this.
http://www.animegfx.net/site.jpg
I have included the Site template with the Logo Top and bottom.php so you can test it out for yourself Just a note your server must have PHP capibillitise Most free hosts Do so its good I hope you enjoyed this and have some fun with it
If you would like to use this template I have included the logo If you would like me to make you a logo you can PM me and I will make you up one.