Learn PHP

This course will become read-only in the near future. Tell us at community.p2pu.org if that is a problem.

Task Navigation 

Including Files

Including a file is very useful in PHP. Include allows us to add another file into our web page. This particular command can, and probably will, save you hours upon hours of work. Let say you have a webiste that has 7 pages, and every page has the exact same header, navigation, or foot.. In HTML you have to open, edit, save, and re-upload ALL 7 pages. With include, you can add a "header" or "footer" to every page. When it comes time to change something, you only have to edit the one file and it will change on every page. In this included file, you can have more PHP, css, html, javascript... you name it! It literally becomes a part of your page.

Example:

footer.php

<hr />
© Websitename 2011
<a href='contact.php'>Contact Page</a>
Created by <a href='mailto:my_email@example.com'>me</a>

Save the above code as footer.php.

Now save the below code as index.php. Make sure they are in the same directory though, since our index page will only be looking in the directory it's in.

index.php

<html>
<body>
This is my page:
<? include("footer.php"); ?>
</body>
</html>

Now upload both footer.php and index.php, and load index.php in your browser.

Pretty cool huh? Add that little include command into your web sites, and you'll save yourself a lot of time.
It also works with variables instead of a string.
Quick Example:
$footer = "footer.php";
include($footer);

What does the page source look like?
...Like it was always a single file page.

Your task:
Create a new file you want to be included in your page, call it include_this.php
Create index.php, and add regular text or HTML like your normally would, but also use the include command to add include_this.php to your page.

 

Task Discussion


  • Tynanh   March 24, 2013, 10:18 p.m.

    I have been using a php include on the site I have been working on for the header and footer (for easy editing) so I thought I would use that example for my include task.

    You can view the code for the index.php and the ?php include()'s here

    include.php

    If you want to see a mock up of the site with the include hit the link at the top of the page in the link above!

  • katpal   June 24, 2012, 10:46 a.m.

    Hi, here is my include code below. I have mixed it up with some javascript to load different content onClick. (I set the display of both content1 and 2 to none in the first place):

    <head>
    <script type="text/javascript">
    //var number=0;
    function myFunction(number)
    {
    var NewID= ('content')+number;
    document.getElementById('maincontent').innerHTML=document.getElementById(NewID).innerHTML;
    }
    </script>
    </head>

    <body>
    <header>
    <?
    include("includes/header.php");
    ?>
    </header>

    <div id="content1">
    <?
    include("includes/article1.php");
    ?>
    </div>
    <div id="content2">
    <?
    include("includes/article2.php");
    ?>
    </div>
    <article>
    <a href="#" onClick="myFunction('1');"> load article 1 </a> | <a href="#" onClick="myFunction('2');"> load article 2</a>
    <div id="maincontent">
    this is the default content
    </div>
    </article>

    <footer>
    <?
    include("includes/footer.php");
    ?>
    </footer>

  • Asier Iturralde Sarasola   April 14, 2012, 8:34 p.m.

    In my task I used the new HTML5 semantic tag <footer>:
    http://dev.w3.org/html5/spec/single-page.html#the-footer-element
    http://www.w3schools.com/html5/tag_footer.asp

    This is my footer.php file:


    <footer>
        <nav>
            <ul>
                <li><a href="/about">About us...</a></li>
                <li><a href="/feedback">Send feedback!</a></li>
                <li><a href="/sitemap">Sitemap</a></li>
            </ul>
        </nav>

        <p><small>Copyright &copy; 2012 The copyright holder</small></p>
    </footer>


    And this is my index.php file:

    <!DOCTYPE html>
    <html>
        <head>
            <title>This is the title of the document</title>
        </head>
        
        <body>
            <p>...</p>
            <p>...</p>        
            <p>...</p>
            <p>...</p>
            <? include("footer.php"); ?>
        </body>
    </html>


    This is the generated HTML code:

    <!DOCTYPE html>
    <html>
        <head>
            <title>This is the title of the document</title>
        </head>
        
        <body>
            <p>...</p>
            <p>...</p>        
            <p>...</p>
            <p>...</p>                
            <footer>
        <nav>
            <ul>
                <li><a href="/about">About us...</a></li>
                <li><a href="/feedback">Send feedback!</a></li>
                <li><a href="/sitemap">Sitemap</a></li>
            </ul>
        </nav>

        <p><small>Copyright &copy; 2012 The copyright holder</small></p>
    </footer>
        </body>
    </html>