DH Templates

Please help with PHP problem?

I can't seem to connect my pages and I need help figuring it out, please. All I did was copy the codes below and changed it for myself so I don't know what the problem is. I'm going to post the codes I used from that website here and hopefully someone can see what I'm doing wrong. Thanks! *****Index.php page***** <body> <?php include ("head.html"); ?> <!-- Table for Main Body --> <table border="0" width="100%" cellspacing="0" cellpadding="2"> <tr> <td valign="top" align="left" width="90"> <?php include ("menu.html"); ?> </td> <td width="1" bgcolor="lightskyblue" valign="top"> </td> <td valign="top"> <?php include ("index.html"); ?> <br> <br> <?php include ("footer.html"); ?> </td> <td width="1" bgcolor="lightskyblue" valign="top"> </td> </tr></table> </body></html> *****Style page***** body { background-color: #FFFFF0; font-family: Arial, Verdana, sans-serif; font-size: 18px; color: #00008B; scrollbar-face-color: antiquewhite; scrollbar-highlight-color: darkorange; scrollbar-3dlight-color: yellow; scrollbar-darkshadow-color: black; scrollbar-shadow-color: antiquewhite; scrollbar-arrow-color: blue; scrollbar-track-color: lightyellow; } a { font-family: Arial, Verdana, sans-serif; font-size: 18px; color: #483D8B; text-decoration: underline} a:hover { font-family: Arial, Verdana, sans-serif; font-size: 18px; color: #A52A2A; background-color: #FAEBD7} h1 { font-family: Arial, Verdana, sans-serif; font-size: 36px; color: #A52A2A } h2 { font-family: Arial, Verdana, sans-serif; font-size: 24px; color: #A52A2A } h3 { font-family: Arial, Verdana, sans-serif; font-size: 24px; color: #A52A2A } h4 { font-family: Arial, Verdana, sans-serif; font-size: 18px; color: #A52A2A } h5 { font-family: Arial, Verdana, sans-serif; font-size: 12px; color: #A52A2A } h6 { font-family: Arial, Verdana, sans-serif; font-size: 8px; color: #A52A2A } hr{ color:brown; background-color:tan; width:90%; height:2px; } table { font-family: Arial, Verdana, sans-serif; font-size: 18px; color: #00008B; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px} .note { font-family: Arial, Verdana, sans-serif; font-size: 14px; color: purple; font-weight: bold;} *****Head page***** <table height="80" width="100%" cellpadding="0" cellspacing="0" border="0"> <tr><td align="left" valign="bottom" width="160" rowspan="2"> <a href="http://www.ibdhost.com/"> <img src="free/images/logo.gif" width="160" height="74" border="0" alt="logo"> </a></td> <td align="left" valign="bottom" height="25" width="100%" nowrap colspan="4"> <b>Title or Links Here</b></td></tr> <tr><td align="right" valign="top" height="50" width="100%" nowrap colspan="4"> <table width="455" height="50" cellspacing="0" cellpadding="0" border="0" background="free/images/headcolor.gif"> <tr> <td height="50" width="55" align="left" valign="top" background="free/images/headback.gif"> <img src="free/images/headback.gif" width="55" height="50" border="0" alt="background"></td><td height="50" width="400" align="center"> </td> </tr></table></td></tr> <tr> <td align="left" valign="top" height="5" background="free/images/headcolor.gif" nowrap colspan="5"> <table width="100%" height="1" cellspacing="0" cellpadding="0" border="0"> <tr> <td><img src="free/images/headcolor.gif" width="1" height="1" alt="bar"> </td></tr></table> </td></tr></table> *****Menu page***** <p>  </p> <div class="menuitem"> <div class="menuhead"> Code Generator</div> <a href="http://www.ibdjohn.com/csstemplate/"> CSS Template</a> <span class="note"> <br/> 3 Column Layout Example</span> </div> <div class="menuitem"> <a href="http://www.ibdjohn.com/csstemplate/"> Example2</a> <span class="note"> <br/> blah blah blah blah blah</span> </div> <p>  </p> *****Index.html page***** <h2> H2 size heading </h2> This is the body / main part of my web page. Anything you put here - including pictures, etc will show on the web page. Summary: this is the 'body' section' Example for a horizontal line = <hr> Example using 'class' = 'note': <span class="note"> Example using 'class' = 'note' </span> Now let's put in an image (that is in the same folder as this file so we don't have to put the full path / URL <img src="images/hoglogo2.gif" border="4" width="100" height="65" alt="Razorback Hog Logo"> Hint: Remember to work on your hard drive and keep a backup of all 'master' files. <P> blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah Ok, since this is so sloppy, what kind of template would you recommend? I'm open to suggestions! 1. Yes, all files are in the same folder. 2. Yes, I called the head page head.html. 3. I neglected to add the html/head opening/closing tags but they're on my pages.

Public Comments

  1. EWWWWW! Tables for layout! Intermixed with HTML 4 DIVs and CSS! That a template? Sloppy... ANYway... to answer your question, let me ask you a question or two: Are all files placed in the same folder? Did you call the "head page" "head.html"? You also don't have the opening <html> element, nor an actual <head> ... </head> section... EDIT: I never recommend templates... because most templates *are* sloppy. Especially for people who are in the learning stages, templates can be an absolute nightmare to work through... as you're experiencing right now. What I usually do is start with a single, one file page, that contains all the various parts I want to repeat in other pages. Then, I take out the repeating parts, and place them in include files, referencing them from the original page. Every web page can be split into a couple of generic parts: Header Contents Navigation Ads and links Footer The contents are the part that changes most frequently, so that stays in the main file - all the other parts get their own include file. So in the end, what I end up with, is something like this: <? include ("siteheader.html"); ?> <? include ("pageheader.html"); ?> <div id = "pagecontents"> ... changing stuff here... </div> <? include ("navigation.html"); ?> <? include ("otherstuff.html"); ?> <? include ("pagefooter.html"); ?> <? include ("sitefooter.html"); ?> I like to keep site headers (opening html, head section) and page headers (title bar, top navigation) separated. When using server-side scripting, the site footer contains nothing but PHP to close any possibly open connections to files and a databse; the page footer contains the visible footer and the closing of the body and html elements. To prevent any obfuscating code, I avoid tables like the plague for layout - they can become way too convoluted, and the chance of a single missed or mistyped TD or TR grows with every change... Each of the parts I mentioned can be generated with a DIV; positioning can be done using CSS. One page container div, one header div, one container for content and navigation, and each of these inside their own div... one for the footer, and you're done. Much easier to maintain, much easier to break up into parts. The original page with all the includes *becomes* the template - and that way, you know that everything works the way it should. Ready-made templates give you a disadvantage, because you don't know the thought process that went into the decision to cut *here* and not *there*... starting with a base, yourself, puts you in control. Style Sheets are best linked to from within the straight HTML, preferably inside the HEAD section: <head> <title> Web Site Title </title> <link rel="stylesheet" type="text/css" href="stylesheet.css" /> </head> ... and that head section is, of course, part of the siteheader include file.
Powered by Yahoo! Answers