1. We have moved from vBulletin to XenForo and you are viewing the site in the middle of the move. Though the functional aspect of everything is working fine, we are still working on other changes including the new design on Xenforo.
    Dismiss Notice

include a header page in all pages in php

Discussion in 'PHP' started by alssadi, Jul 1, 2011.

  1. alssadi

    alssadi Banned

    Joined:
    Dec 11, 2010
    Messages:
    41
    Likes Received:
    3
    Trophy Points:
    0
    Occupation:
    Creative director & web developer
    Location:
    Dubai
    Home Page:
    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 :- ​
    [​IMG]
    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.​
    [​IMG]
    Figure 1.2​
    Part 1 :-
    The header.php page code is as follow :-
    PHP:
     <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="images/cor_1.gif" /></td>
        <td height="14" colspan="2" class="topolino">&nbsp;</td>
        <td width="13" height="14" align="right" valign="top"><img src="images/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="images/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="images/logo_2.gif" /></td>
          </tr>
        </table></td>
        <td class="rightline">&nbsp;</td>
      </tr>
      <tr>
        <td align="left" valign="bottom"><img src="images/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="images/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:
     <!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="images/cor_1.gif" /></td>
                            <td height="14" colspan="2" class="topolino">&nbsp;</td>
                            <td width="13" height="14" align="right" valign="top">
                            <img src="images/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="images/cor_3.gif" /></td>
                            <td colspan="2" class="botline"><a href="index.php"></a>
                            </td>
                            <td align="right" valign="bottom">
                            <img src="images/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="images/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:
                 <tr>
                    <td width="350" height="84" align="center" valign="middle"><?php include("header.php"); ?></td>
                </tr> 
    [​IMG]

    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:

  2. pein87

    pein87 New Member

    Joined:
    Aug 6, 2010
    Messages:
    173
    Likes Received:
    47
    Trophy Points:
    0
    Occupation:
    Web Dev
    Location:
    Limbo
    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.
     
  3. alssadi

    alssadi Banned

    Joined:
    Dec 11, 2010
    Messages:
    41
    Likes Received:
    3
    Trophy Points:
    0
    Occupation:
    Creative director & web developer
    Location:
    Dubai
    Home Page:
    i think everyone got his own way of creating templates, different era different type of coding ;) , but anyway thanks for the comment.
     
  4. ManzZup

    ManzZup New Member

    Joined:
    May 9, 2009
    Messages:
    278
    Likes Received:
    43
    Trophy Points:
    0
    Occupation:
    Production Manager:Software @ ZONTEK
    Location:
    Sri Lanka
    Home Page:
    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
    :D
     
    alssadi likes this.
  5. alssadi

    alssadi Banned

    Joined:
    Dec 11, 2010
    Messages:
    41
    Likes Received:
    3
    Trophy Points:
    0
    Occupation:
    Creative director & web developer
    Location:
    Dubai
    Home Page:
    I think ManzZup got the idea out of this post ;)
     
  6. pein87

    pein87 New Member

    Joined:
    Aug 6, 2010
    Messages:
    173
    Likes Received:
    47
    Trophy Points:
    0
    Occupation:
    Web Dev
    Location:
    Limbo
    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.
     

Share This Page