Publishers of technology books, eBooks, and videos for creative people

Home > Articles

Creating Dynamic Web Sites

  • Print
  • + Share This
This chapter is from the book

With the fundamentals of PHP under your belt, it's time to begin building truly dynamic Web sites. Dynamic Web sites, as opposed to the static ones on which the Web was first built, are easier to maintain, are more responsive to users, and can alter their appearance based upon differing situations.

In this chapter, I'll be covering a hodgepodge of ideas, all used to create dynamic Web applications. These include incorporating external files, writing and using your own functions, sending email, redirecting the Web browser, and using PHP's date() function. Some of the specific examples are based upon the work done in the previous chapters, and most of this chapter's code will be used in later chapters in one form or another.

Using External Files

To this point, every script in the book has consisted of a single file that contains all of the required code. But as you develop more complex Web sites, you'll see that this methodology has many limitations. PHP can readily make use of external files, which allows you to divide your scripts into their distinct parts. Frequently you will use external files to extract your HTML from your PHP or to separate out commonly used processes.

PHP has four functions for using external files: include(), include_once(), require(), and require_once(). To use them, your PHP script would have a line like

include_once("filename.php");
require('/path/to/filename.html');

The use of one of these functions has the end result of taking all the contents of the included file and dropping it in the parent script (the one calling the function) at that juncture. An important attribute of included files is that PHP will treat the included code as HTML (i.e., send it directly to the browser) unless it contains code within the PHP tags.

Previous versions of PHP had a different distinction between when you'd use include() and when you'd use require(). Now the functions are exactly the same when working properly but behave differently when they fail. If an include() function doesn't work (it cannot include the file for some reason), a warning will be printed to the Web browser ( Figure 3.1 ), but the script will continue to run. If require() fails, an error is printed and the script is halted ( Figure 3.2 ).

03fig01.gif

Figure 3.1 Two failed include() calls.

03fig02.gif

Figure 3.2 The first failure of a require() function will print an error and terminate the execution of the script.

Both functions also have a _once() extension, which guarantees that the file in question is included only one time should a script accidentally attempt to include it repeatedly.

require_once('filename.html');

In this first example, I'll use included files to separate my HTML formatting from my PHP code. Then, the rest of the examples in this chapter will be able to use the same HTML layout without you having to rewrite the code every time.

To use external files:

  1. Design an HTML page in your text or WYSIWYG editor (Script 3.1 and Figure 3.3 ).
    03fig03.gif

    Figure 3.3 The HTML design as it appears in the Web browser.

    To start, I'll design an HTML layout for my application, independent of any PHP code. The section of the layout that will change from page to page is marked by the word content in many forms.
  2. Copy everything from the first line of the layout's source to just before the page-specific content and paste it in a new document (Script 3.2).
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
            "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
       <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
       <title>PAGE TITLE</title>
    </head>
    <body bgcolor="#FFFFFF">
    <table width="100%" border="0" cellspacing="0" cellpadding="4">
       <tr>
           <td width="100%" bgcolor="#666666"><font color="#CCCCCC"><big><b>Welcome to my site!</b></big></font></td>
       </tr>
       <tr>
           <td bgcolor="#CCCCCC"> <table width="100%" border="0" cellspacing="1" cellpadding="2">
             <tr>
             <td align="center"><a href="index.php">Home</a></td>
             <td align="center"><a href="dateform.php">Date Form</a></td>
             <td align="center"><a href="calculator.php">Calculator</a></td>
             <td align="center"><a href="register.php">Register</a></td>
    </tr>
          </table></td>
       </tr>
    </table>
    <br />
    <!-- Script 3.2 header.inc -->
    
    This first file will contain the initial HTML tags (from DOCTYPE through the head and into the beginning of the page body).
  3. Change the page's title line to read
    <title><?php echo $page_title; ?></title>
    
    I'll want the page title (which appears at the top of the Web browser; see Figure 3.3) to be changeable on a page-by-page basis. To do so, I set this as a variable that will be printed out by PHP.
  4. Save the file as header.inc. Included files can use just about any extension for the filename. Some programmers like to use .inc to indicate it's an included file. (See the Site Structure sidebar and Chapter 8, "Security," for more information.)
  5. Copy everything in the original template from the end of the page-specific content to the end of the page and paste it in a new file. (Script 3.3).
    <!-- Script 3.3 footer.inc -->
    <br />
    <table width="100%" border="0" cellspacing="0" cellpadding="2" bgcolor="#CCCCCC">
       <tr>
         <td> <div align="center">&copy; 2003 Larry E. Ullman and DMC Insights, Inc.</div></td>
       </tr>
    </table>
    </body>
    </html>
    
    The footer file contains the remaining formatting for the page body and then closes the HTML document.
  6. Save the file as footer.inc.
  7. Create a new PHP document in your text editor (Script 3.4).
    <?php # Script 3.4 - index.php
    
    Since this script will use the included files for most of its HTML formatting, I can begin and end with the PHP tags rather than HTML.
  8. Set the $page_title variable and include the HTML header.
    $page_title = 'Welcome!';
    include ('./header.inc');
    
    The $page_title will allow me to set a new title for each page that uses this template system. Since I establish the variable before I include the header file, the header file will have access to that variable.
  9. Close the PHP tags and copy over the page-specific content from the template.
    ?>
    <table width="90%" border="0" cellspacing="2" cellpadding="4" align="center">
       <tr bgcolor="#333333">
          <td>
       <table width="100%" border="0" cellspacing="0" cellpadding="4">
             <tr>
                <td bgcolor="#FFFFFF">&nbsp;!&nbsp;</td>
                <td width="100%"> <font color="#CCCCCC"> <b>Content Title</b></font></td>
             </tr>
          </table></td>
       </tr>
    </table>
    <table width="90%" border="0" cellspacing="4" cellpadding="4" align="center">
       <tr>
          <td width="70%" valign="top"> <p><b>Content....</b></p>
             <hr />
             <p>Blah, blah, blah ... more content.</p>
          </td>
       </tr>
    </table>
    
    This information could be sent to the browser using echo(), but since there's no dynamic content here, it'll be easier and more efficient to exit the PHP tags temporarily.
  10. Create a final PHP section and include the footer file.
    <?php
    include ('./footer.inc');
    ?>
    
  11. Save the file as index.php, upload to your Web server along with header.inc and footer.inc, and test in your Web browser ( Figure 3.4 ).
    03fig04.gif

    Figure 3.4 Now the same layout (see Figure 3.3) has been created using external files in PHP.

  12. If desired, view the HTML source of the page ( Figure 3.5 ).
    03fig05.gif

    Figure 3.5 The generated HTML source of the Web page should replicate the code in the original template (refer to Script 3.1).

Example 3.1. The HTML template for this chapter's Web pages.

1   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
2           "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
3   <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
4   <head>
5       <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
6       <title>PAGE TITLE</title>
7   </head>
8   <body bgcolor="#FFFFFF">
9   <table width="100%" border="0" cellspacing="0" cellpadding="4">
10    <tr>
11      <td width="100%" bgcolor="#666666"><font color="#CCCCCC"><big><b>Welcome to my site!</b></big></font></td>
12    </tr>
13    <tr>
14      <td bgcolor="#CCCCCC"> <table width="100%" border="0" cellspacing="1" cellpadding="2">
15          <tr>
16            <td align="center"><a href="index.php">Home</a></td>
17            <td align="center"><a href="dateform.php">Date Form</a></td>
18            <td align="center"><a href="calculator.php">Calculator</a></td>
19            <td align="center"><a href="register.php">Register</a></td>
20          </tr>
21        </table></td>
22    </tr>
23  </table>
24  <br />
25  <!-- PAGE SPECIFIC CONTENT STARTS HERE. -->
26  <table width="90%" border="0" cellspacing="2" cellpadding="4" align="center">
27    <tr bgcolor="#333333">
28      <td>
29     <table width="100%" border="0" cellspacing="0" cellpadding="4">
30          <tr>
31            <td bgcolor="#FFFFFF">&nbsp;!&nbsp;</td>
32            <td width="100%"> <font color="#CCCCCC"> <b>Content Title</b></font></td>
33          </tr>
34        </table></td>
35    </tr>
36  </table>
37  <table width="90%" border="0" cellspacing="4" cellpadding="4" align="center">
38    <tr>
39      <td width="70%" valign="top"> <p><b>Content....</b></p>
40       <hr />
41       <p>Blah, blah, blah ... more content.</p>
42       </td>
43    </tr>
44  </table>
45  <!-- PAGE SPECIFIC CONTENT END HERE. -->
46  <br />
47  <table width="100%" border="0" cellspacing="0" cellpadding="2" bgcolor="#CCCCCC">
48    <tr>
49      <td> <div align="center">&copy; 2003 Larry E. Ullman and DMC Insights, Inc.</div></td>
50    </tr>
51  </table>
52  </body>
53  </html>

Example 3.2. The beginning of each Web page will be stored in a header file.

1  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
2             "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
3  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
4  <head>
5      <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
6      <title><?php echo $page_title; ?></title>
7  </head>
8  <body bgcolor="#FFFFFF">
9  <table width="100%" border="0" cellspacing="0" cellpadding="4">
10   <tr>
11     <td width="100%" bgcolor="#666666"><font color="#CCCCCC"><big><b>Welcome to my site!</b></big></font></td>
12   </tr>
13   <tr>
14     <td bgcolor="#CCCCCC"> <table width="100%" border="0" cellspacing="1" cellpadding="2">
15         <tr>
16           <td align="center"><a href="index.php">Home</a></td>
17           <td align="center"><a href="dateform.php">Date Form</a></td>
18           <td align="center"><a href="calculator.php">Calculator</a></td>
19           <td align="center"><a href="register.php">Register</a></td>
20         </tr>
21       </table></td>
22   </tr>
23 </table>
24 <br />
25 <!-- Script 3.2 header.inc -->
26 <!-- PAGE SPECIFIC CONTENT STARTS HERE. -->

Example 3.3. The conclusion of each Web page will be stored in this footer file.

1  <!-- Script 3.3 footer.inc -->
2  <br />
3  <table width="100%" border="0" cellspacing="0" cellpadding="2" bgcolor="#CCCCCC">
4    <tr>
5      <td> <div align="center">&copy; 2003 Larry E. Ullman and DMC Insights, Inc.</div></td>
6    </tr>
7  </table>
8  </body>
9  </html>

Example 3.4. This script makes a Web page using a template stored in external files.

1  <?php # Script 3.4 - index.php
2
3  // Set the page title and include the HTML header.
4  $page_title = 'Welcome!';

   5  include ('./header.inc');
6  ?>
7  <table width="90%" border="0" cellspacing="2" cellpadding="4" align="center">
8    <tr bgcolor="#333333">
9      <td>
10    <table width="100%" border="0" cellspacing="0" cellpadding="4">
11         <tr>
12           <td bgcolor="#FFFFFF">&nbsp;!&nbsp;</td>
13           <td width="100%"> <font color="#CCCCCC"> <b>Content Title</b></font></td>
14         </tr>
15       </table></td>
16   </tr>
17 </table>
18 <table width="90%" border="0" cellspacing="4" cellpadding="4" align="center">
19   <tr>
20     <td width="70%" valign="top"> <p><b>Content....</b></p>
21      <hr />
22      <p>Blah, blah, blah ... more content.</p>
23      </td>
24   </tr>
25 </table>
26 <?php
27 include ('./footer.inc'); // Include the HTML footer.
28 ?>

Example 3.5. This function is useful for creating a series of pull-down menus.

1  <?php # Script 3.5 - dateform.php
2
3  // Set the page title and include the HTML header.
4  $page_title = 'Calendar Form';
5  include ('./header.inc');
6
7  // This function makes three pull-down menus for the months, days, and years.
8  function make_calendar_pulldown() {
9
10     // Make the months array.
11     $months = array (1 => 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');
12
13     // Make the pull-down menus.
14     echo '<select name="month">';
15     foreach ($months as $key => $value) {
16         echo "<option value=\"$key\">$value</option>\n";
17     }
18     echo '</select>
19     <select name="day">';
20     for ($day = 1; $day <= 31; $day++) {
21         echo "<option value=\"$day\">$day</option>\n";
22     }
23     echo '</select>
24     <select name="year">';
25     $year = 2003;
26     while ($year <= 2010) {
27         echo "<option value=\"$year\">$year</option>\n";
28         $year++;
29     }
30     echo '</select>';
31 } // End of the make_calendar_pulldown() function.
32
33 echo '<form action="dateform.php" method="post">'; // Create the form.
34 make_calendar_pulldown(); // Make the calendar.
35 echo '</form>'; // End of form.
36
37 include ('./footer.inc'); // Include the HTML footer.
38 ?>
  • + Share This
  • 🔖 Save To Your Account