include a header page in all pages in php

alssadi's Avatar
Banned
First lets have a look at what we are going to do , the aim of this article is to make a header page that can be included in all pages without any problem . so lets have a look at the final output of this article :-
Figure 1.1
So how this thing work?
Here is a abit of explanation about where is the header.php page and the 1.php page where we will include the header.php page to the 1.php page.
Figure 1.2
Part 1 :-
The header.php page code is as follow :-
PHP Code:
 <script type="text/javascript" src="Scripts/jquery.js"></script>
<script type="text/javascript" src="js/general.js"></script>
<script type="text/javascript">
setInterval(getMyDate,1000);
function getMyDate(){
    var date=new Date();
    $("#span_time").html(date.getHours()+":"+date.getMinutes()+":"+date.getSeconds());
}
</script>
<table width="1000" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="13" height="14" align="left" valign="top"><img src="http://i1.g4estatic.com/cor_1.gif" /></td>
    <td height="14" colspan="2" class="topolino">&nbsp;</td>
    <td width="13" height="14" align="right" valign="top"><img src="http://i1.g4estatic.com/cor_2.gif" /></td>
  </tr>
  <tr>
    <td height="101" class="leftline">&nbsp;</td>
    <td colspan="2" align="center" valign="middle"><table width="900" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="160" height="101" align="left" valign="middle"><img src="http://i1.g4estatic.com/logo_2.gif" /></td>
        <td width="13" align="left" valign="bottom">&nbsp;</td>
        <td width="649" align="center" valign="middle" class="heading"><b>
        <font size="6">GO EXPERT</font></b></td>
        <td width="15" align="left" valign="bottom">&nbsp;</td>
        <td width="163" align="right" valign="middle"><img src="http://i1.g4estatic.com/logo_2.gif" /></td>
      </tr>
    </table></td>
    <td class="rightline">&nbsp;</td>
  </tr>
  <tr>
    <td align="left" valign="bottom"><img src="http://i1.g4estatic.com/cor_3.gif" /></td>
    <td colspan="2" align="right" valign="top" class="botline"><span id="span_time"></span></td>
    <td align="right" valign="bottom"><img src="http://i1.g4estatic.com/cor_4.gif" /></td>
  </tr>
  <tr>
    <td align="left" valign="bottom">&nbsp;</td>
    <td width="671" align="left" valign="top">&nbsp;</td>
    <td width="303" align="right" valign="middle"><a href="#"></a></td>
    <td align="right" valign="bottom">&nbsp;</td>
  </tr>
</table> 
Part 2 :-
The 1.php code is as follow :-

PHP Code:
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>GO EXPERT Page By Hisham Alssadi</title>
<link href="css/alssadi.css" rel="stylesheet" type="text/css" />
</head>

<body>

<table width="100%" border="0" height="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td align="center" valign="top"><br />
        <table width="1000" border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td width="350" height="84" align="center" valign="middle"><?php include("header.php"); ?></td>
            </tr>
            <tr>
                <td height="84" align="center" valign="middle">
                <table width="1000" border="0" cellpadding="0" cellspacing="0" id="boxor">
                    <tr>
                        <td width="13" height="14" align="left" valign="top">
                        <img src="http://i1.g4estatic.com/cor_1.gif" /></td>
                        <td height="14" colspan="2" class="topolino">&nbsp;</td>
                        <td width="13" height="14" align="right" valign="top">
                        <img src="http://i1.g4estatic.com/cor_2.gif" /></td>
                    </tr>
                    <tr>
                        <td height="123" class="leftline">&nbsp;</td>
                        <td width="564" align="center" valign="middle">&nbsp;<table width="200" border="0">
                            <tr>
                            </tr>
                        </table>
                        <p><b><font size="6">you can add something here </font>
                        </b></p>
                        </td>
                        <td width="410" align="center" valign="bottom"></td>
                        <td class="rightline">&nbsp;</td>
                    </tr>
                    <tr>
                        <td align="left" valign="bottom">
                        <img src="http://i1.g4estatic.com/cor_3.gif" /></td>
                        <td colspan="2" class="botline"><a href="index.php"></a>
                        </td>
                        <td align="right" valign="bottom">
                        <img src="http://i1.g4estatic.com/cor_4.gif" /></td>
                    </tr>
                    <tr>
                        <td align="left" valign="bottom">&nbsp;</td>
                        <td colspan="2" align="center" valign="top">
                        <a href="index.php">
                        <img src="http://i1.g4estatic.com/main.jpg" width="145" height="28" /></a></td>
                        <td align="right" valign="bottom">&nbsp;</td>
                    </tr>
                    <tr>
                        <td align="left" valign="bottom">&nbsp;</td>
                        <td colspan="2" align="center" valign="top"><a href="#">
                        © 2011 By Alssadi</a></td>
                        <td align="right" valign="bottom">&nbsp;</td>
                    </tr>
                </table>
                </td>
            </tr>
        </table>
        </td>
    </tr>
</table>

</body>

</html>


The key trick is on this line where you include the header.php in 1.php :-


HTML Code:
             <tr>
                <td width="350" height="84" align="center" valign="middle"><?php include("header.php"); ?></td>
            </tr>


Figure 1.3

Its pretty simple technique to include the header to all the pages that you design , i think all the codes above explained how to include the header page in all pages.

attachment is included for all the other details like the css file and the images.

regards alssadi.

like this post if its helpful
Attached Files
File Type: zip alssadi.zip (203.5 KB, 6 views)
0
pein87's Avatar
Ambitious contributor
You could also go modern and create a template system that before compile requires it to be added or auto adds it to the top of every template. This approach is hard coded and is not something to consider in an real world marketable product. You could also make a class the holds render info per page that auto adds it in at the top of the array list. Although its something that could be used in modern contexts its very primitive and does not conform with the standard software design of dynamic content with only functionality being hard coded but extendable. You could also make a function that adds some dynamics to your solution where all you'd need to do is create an associative array or another method for include info. Good idea just to primitive and not very useful in the modern era of per page include loading and template systems.
0
alssadi's Avatar
Banned
i think everyone got his own way of creating templates, different era different type of coding , but anyway thanks for the comment.
0
ManzZup's Avatar, Join Date: May 2009
Skilled contributor
i agree with the template sytstem
but i wont think that a simple user who wanna create his own peaceful website would ever think of using one of these template systems
alssadi like this
0
alssadi's Avatar
Banned
I think ManzZup got the idea out of this post
0
pein87's Avatar
Ambitious contributor
There is more then one method, however the more dynamic the site is the easier it is to extend it and customize it. For example you could create a folder and name it skins. Then each sub folder would be a skin. Create a function to read that directory and then you can load a full skin that way with a log file that tells it render order etc... Its simple, easy to make, and allows for different for partials of different template being loaded into a page.