For example how would i turn the following code into a template and an index page? The various parts would be the header, menu, main content, and footer, but i do not know how to take this page and turn it into a template (that links to header.html etc so i would just change one page) and what the index page linking to the various parts would look like... its probably very simple, but i just do not have a mental grasp on it just yet. This would help me a lot. If the code below is too complicated to sift through , just use a stripped down version of a page, because I really need this information. THANK YOU SO MUCH FOR YOUR TIME!!!!
<html><br />
<head><br />
<script src="scripts/rollover.js" type="text/javascript"></script><br />
<LINK REL=stylesheet HREF="scripts/gears.css" TYPE="text/css"><br />
<title>Zea Web</title><br />
</head><br />
<body><br />
<br />
<img id="welcome" src="images/title_welcome.gif" width="105" height="21" alt="" border="0"><br />
<img id="title" src="images/title_zea.gif" width="408" height="94" alt="" border="0"><br />
<br />
<div class="topbar"><br />
<div class="bar2"></div> <br />
<div class="navcontainer"> <br />
<div class="nav"><br />
<a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('home','','images/buttons/button_home_glow.gif',1)"><img name="home" src="images/buttons/button_home_page.gif" align="middle" border="0px"></a><img src="images/transparent.gif" width="15"><br />
<a href="pages/design_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('design','','images/buttons/button_design_glow.gif',1)"><img name="design" src="images/buttons/button_design.gif" align="middle" border="0px"></a><img src="images/transparent.gif" width="15"><br />
<a href="pages/neopets_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('neopets','','images/buttons/button_neopets_glow.gif',1)"><img name="neopets" src="images/buttons/button_neopets.gif" align="middle" border="0px"></a><img src="images/transparent.gif" width="15"><br />
<a href="pages/wolf_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('wolf','','images/buttons/button_wolf_glow.gif',1)"><img name="wolf" src="images/buttons/button_wolf.gif" align="middle" border="0px"></a><img src="images/transparent.gif" width="15"><br />
<a href="smf/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('board','','images/buttons/button_board_glow.gif',1)"><img name="board" src="images/buttons/button_board.gif" align="middle" border="0px"></a><img src="images/transparent.gif" width="15"><br />
<a href="pages/talk_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('talk','','images/buttons/button_talk_glow.gif',1)"><img name="talk" src="images/buttons/button_talk.gif" align="middle" border="0px"></a><img src="images/transparent.gif" width="15"><br />
<a href="pages/links_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('links','','images/buttons/button_links_glow.gif',1)"><img name="links" src="images/buttons/button_links.gif" align="middle" border="0px"></a><img src="images/transparent.gif" width="15"><br />
<a href="pages/about_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about','','images/buttons/button_about_glow.gif',1)"><img name="about" src="images/buttons/button_about.gif" align="middle" border="0px"></a><br />
</div><br />
</div><br />
<br />
<div class="corner"><br />
<img src="images/corner_person2.png" height="125" alt="" border="0"><br />
</div><br />
<br />
</div><br />
<br />
<div class="main"><br />
<div class="frontpage"><br />
<center><br />
<table border="0" cellspacing="0" cellpadding="0"><br />
<tr><br />
<td width="250" align="right" valign="middle"><br />
<a href="index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_welcome2.jpg',1)">Home</a> <br><br><br />
<a href="pages/design_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_website.jpg',1)">Website Design</a> <br><br><br />
<a href="pages/neopets_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_neopets.jpg',1)">Neopets Code and Graphics</a> <br><br><br />
<a href="pages/wolf_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_wolf.jpg',1)">The Really Wild <br>Wolf Pack Guild</a> <br><br><br />
</td><br />
<td width="300"><br />
<center><br />
<p><img name="image1" src="images/main_welcome.jpg" width="426" height="245" border="0" alt="Welcome to Zea Web" align="middle"></p><br />
</center><br />
</td><br />
<td width="250" align="left" valign="middle"><p><br />
<a href="smf/index.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_odds.jpg',1)">Forums</a><br><br><br />
<a href="pages/talk_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_talk.jpg',1)">Talk to Zea</a><br><br><br />
<a href="pages/links_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_links.jpg',1)">Links</a><br><br><br />
<a href="pages/about_index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/main_about.jpg',1)">About Zea</a><br />
</td><br />
</tr><br />
</table><br />
</center><br />
<br><br><br />
</div><br />
<br />
<div class="footer"><br />
<div class="footbar"><br />
<div class="ads"><center><br />
<table width="100%" height="90px"><br />
<tr><br />
<td width="33%"><br />
<form action="https://www.paypal.com/cgi-bin/webscr" method="post"><br />
<input type="hidden" name="cmd" value="_s-xclick"><br />
<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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-----END PKCS7-----<br />
"><br />
<input type="image" src="http://www.zea-web.com/images/donate_gears5.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!"><br />
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1"><br />
</form><br />
<br />
<br />
</td><br />
<td width="33%"><br />
<!-- Beginning of Project Wonderful ad code: --><br />
<!-- Ad box ID: 35458 --><br />
<script type="text/javascript"><br />
<!--<br />
var d=document;<br />
d.projectwonderful_adbox_id = "35458";<br />
d.projectwonderful_adbox_type = "1";<br />
d.projectwonderful_foreground_color = "";<br />
d.projectwonderful_background_color = "";<br />
</script><br />
<script type="text/javascript" src="http://www.projectwonderful.com/ad_display.js"></script><br />
<noscript><map name="admap35458" id="admap35458"><area href="http://www.projectwonderful.com/out_nojs.php?r=0&c=0&id=35458&type=1"shape="rect" coords="0,0,468,60" title="" alt="" target="_blank" /></map><br />
<table cellpadding="0" border="0" cellspacing="0" width="468" bgcolor="#ffffff"><tr><td><img src="http://www.projectwonderful.com/nojs.php?id=35458&type=1" width="468" height="60" usemap="#admap35458" border="0" alt="" /></td></tr><tr><td bgcolor="#ffffff" colspan="1"><center><br />
<a style="font-size:10px;color:#0000ff;text-decoration:none;line-height:1.2;font-weight:bold;font-family:Tahoma, verdana,arial,helvetica,sans-serif;text-transform: none;letter-spacing:normal;text-shadow:none;white-space:normal;word-spacing:normal;" href="http://www.projectwonderful.com/advertisehere.php?id=35458&type=1" target="_blank"><br />
Ads by Project Wonderful! Your ad here, right now: $0</a></center></td></tr><tr> <td colspan=1 valign="top" width=468 bgcolor="#000000" style="height:3px;font-size:1px;padding:0px;max-height:3px;"></td></tr></table><br />
</noscript><br />
<!-- End of Project Wonderful ad code. --></td><br />
<td width="33%"><div align="right"><font color="#c8c8c8" size="-3"><sub>Neopets-related images (c) 2000-2009 Neopets, Inc. </sub><br><br />
<sup>All Rights Reserved. Used With Permission.<br><br />
All other images copyright Zea-Web.</font></sup></div><br />
</td><br />
</tr><br />
</table><br />
</div><br />
<br />
<br />
</div><br />
<br />
<br />
</div><br />
<br />
</div><br />
<br />
<br />
<br />
<br />
<br />
</body><br />
<br />
</html><br />