views:

809

answers:

5

I've checked lots of tutorials about including header, navigation and footer using php "include". But I ended up separating my html tags. For instance, my <div id="content"> is in "header.html" while it closing </div> tag is in the footer. This gives me some problem when I use jQuery and looks kinda messy. Is there a better practice to generate external content? (is jQuery the solution?)

index.php

<?php include("header.html"); ?>
<?php include("navigation.html"); ?>
<div id="content">
    <h2 class="clear">This is the contact page</h2>
     <p>
     Main content here... Main content here... Main content here... Main content here...
     Main content here... Main content here... Main content here... Main content here...
     Main content here... Main content here... Main content here... Main content here...
     Main content here... Main content here... Main content here... Main content here...
     Main content here... Main content here... Main content here... Main content here...
     Main content here... Main content here... Main content here... Main content here...
     </p>
    </div>
<?php include("footer.html"); ?>

header.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>Study at Best</title>
    <script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="scripts/jquery.corner.js"></script>
    <script type="text/javascript" src="scripts/jquery.dropshadow.js"></script>
    <script type="text/javascript" src="scripts/jqueryScripts.js"></script>
    <link rel="stylesheet" rev="stylesheet" href="styles/layout.css" />
    <link rel="stylesheet" rev="stylesheet" href="styles/ddm.css" />
</head>
<body>
<div id="container">
    <div id="header">
    This is the header
    </div>

footer.html

    <div id="footer">
     <p>BEST School &copy; Copyright 2009</p>
    </div>
</div>
</body>
</html>
A: 

What problem is this causing? This is a fairly standard practice (I use it), and I've never known it to create any problems. jQuery shouldn't be an issue, since no jQuery code is ran until all of the html has been joined together anyway.

Jonathan Sampson
A: 

Shouldn't be causing any problems. Personally, If navigation was simple, i'd put it inside header, and if not, i'd dynamically generate it via PHP and put it in a class, and include that class in the header.

lyrae
A: 

I do not see a problem with this. I have used this technique many times before. For me it keeps everything well organized. And like Jonathan Sampson said, there should not be any issue with jQuery.

VinkoCM
A: 

In my personal opinion this doesn't look right. I mean simply don't do this to yourself. It will be a nightmare if the site becomes more complex. What about only putting the footer div in footer.html the same for header.html? The rest belongs in index.php. If index.php becomes to complex, split it up more (javascript.html..). – merkuro Jun 20 at 21:22

janoChen
You are right it's better!
janoChen
A: 

Hm, ok, not sure if this is better way of doing it, but what I tend to do is to have a template file that contains both the header, the footer, the menus, left side, right side, whatever else is not specific to just one page, including all the js includes and such. And then the index.php would simply have a content variable in which all the index content goes. At the end of index i then require the template file which places the "content" variable inside where it belongs and tada, all your headaches are over.