PHP Lab Exercise
Lab Exercise - PHP
Instructions
Now it gets interesting. As we’ve talked about in class, XHTML is good for presenting information, but in the end it is only a flat markup language. You literally use XHTML to “markup” the text and graphics of your pages to give the browser instructions on how to display the text and graphics on that page. XHTML pages by themselves cannot accept any input from the user, and they can’t dynamically change based on outside information. Think about this: although good content is the true key to a good website, what web sites do you go back to again and again? Times up! I’ll tell you: you go back to the web sites that have good content and that you can interact with. What do you think? Should we try to create some interactive pages of our own?
In order to create an interactive web page, you’ve got to know more than just XHTML. You’ve got to know a programming language. Lucky for you, I have put the one of the most popular server side programming languages onto our class web server: PHP. As I’ve already noted in the lecture, PHP was invented in the early 90’s by Rasmus Lerdorf, and all he wanted to do was count the number of people viewing his resume. Today, PHP is now a full-fledged programming language on par with heavy weights like Java. And thanks to its popularity (and the fact that it is free), when you get your first job in the “real world” most likely the library you work at is also going to be using PHP. Learning a little about it now will definitely give you a leg up.
And although PHP is great for helping people create interactive web pages, PHP can also do a lot of stuff behind the scenes to make your life as a fledgling webmaster a whole lot easier. For example, by using PHP includes we can create a standard “header” and “footer” that we can use on every page that we create from now on. Imagine never having to type all that XHTML on your pages again, except for one page that you refer to on all of the pages on your site. Think of PHP includes as CSS on steroids.
For our first foray into PHP we are going to learn how to create these wonderful includes and we are going to create a mail form. Some of you may be thinking this is pretty lame, but hey, we gotta start somewhere. Some of you may also be thinking that this is a lot like the Forms lab. The big difference between this and the Forms lab is that in this lab you will be creating both the form and the email script the form points to in the action.
So let’s get started!
Step 1: Open Notepad and create a New document
Step 2: Add the following 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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>
<?php print "$title"; ?>
</title></head>
<body bgcolor="#ffffff">
<h2><?php print "$title"; ?></h2>
Step 3: Save this document as header.php and FTP to your directory on vader.lib.umn.edu
Let’s talk about this file a little bit. First of all you should notice that as far as XHTML documents go, it isn’t finished. It doesn’t include the closing </body> or </html> tags. Good catch. Luckily, this file will never be used by itself. It will always be used in conjunction with both a main body text type file, and a file called “footer.php.” “footer.php” is where we will complete our XTHML. Are you with me so far? Let’s take a look at a little more then. You should also note that we saved this file as “.php”. This is very important. This tells the server that it should be aware that some PHP code may be present in this file. If we had saved this file with the .html extension, the server would ignore any PHP code we included. A file that is saved as .php doesn’t have to have PHP code, but if you are including PHP code the file has to be saved as .php. Does this make sense?
You’ll also note that header.php contains some funky coding that we’ve never seen before, most of which starts with “<?php”. This is a PHP code block. PHP code blocks always start with “<?php” and end with “?>”. What this bit of code does is tells the server to parse this section of code as PHP while leaving the rest of the file alone, or as simple XHTML. Now check out the variable called $title. If you’ll recall from the lecture, a variable is a bit of code that acts as a container for a value we wish to use more than once. So, what is the value of this variable? Ah … good question. We haven’t specified what the value is yet. We will do that in another file down the road. But you may also want to note that once we do specify that value it will be both the title of the XHTML file, and it will appear at the top of the page in between some <h2> tags since we are printing it out in these areas of our code. Let’s move on to the next file.
Step 4: Open Notepad and create a New document. Type in the following code:
<br /><br />
<hr noshade="noshade" />
URL: http://vader.lib.umn.edu<?php echo $_SERVER[“PHP_SELF”]; ?><br />
<?php $last_revised = date("F d, Y", getlastmod());
print "Last revised: $last_revised<br />"; ?>
</body>
</html>
Step 5: Save this file as footer.php and FTP it to vader.lib.umn.edu.
This is the end of the XHTML we started in header.php. Again, this file will never be used alone. It will always be used in conjunction with at least one other file. There are also two other bits of PHP code in the file. First of all, we have the environment variable $_SERVER[“PHP_SELF”]. An environment variable is a variable that you don’t specify yourself. It comes automatically with the server running PHP. There are a bunch of them, but for our purposes we will just deal with this one. $_SERVER[“PHP_SELF”] is a variable that holds the value of the name of the file itself. So, by printing it out in this way (echo), we can print out the actual URL of the file dynamically. This means, if all goes as planned, we shouldn’t have to keep manually writing out the file name on this line. PHP will do it for us every time we use footer.php. Slick, heh?
Secondly, the footer.php file contains some “last revised” information which lets the reader know when was the last time this page was updated. Again, why should we have to manually type this information in when the server will do it for us? So, first of all we create a variable named $last_revised. And we assign that variable the value of date("F d, Y", getlastmod()). I know what you are thinking: huh? What this is is the date() function of PHP. PHP comes with a whole bunch of built in functions that extend the power of the programming language. In this case, this function let’s us work with dates. Specifically, it prints out the date in “F, d, Y” format. In the date() function, the “F” stands for the month, the “d” stands for the day, and the “Y” stands for the year. Check out http://us2.php.net/manual/en/function.date.php for more date codes that you can try. We also specify another function inside the date function: getlasmod(); this function obviously gets the last modified date from the server for the file it is used on. Used with the date function and our fancy coding we print it out for the user to see. At least that is the goal. Let’s move on.
So, we’ve got the header and footer for our site. Now all we need is a file to attach these puppies to. So, let’s create a file, but this won’t be any ordinary file. It will be one on which the user can finally interact with our site. It will be a mail form!
Step 6: Open Notepad and create a New document. Type in the following code:
<?php
$title = “Mail form”;
include(“header.php”);
?>
<p>Thanks for taking the time to let me know what you think of my humble site. Please use the form below to submit your comments to me:</p>
<form action=“form-mail.php” method=”post”>
Name: <input type=”text” name=”name” /><br />
Email: <input type=”text” name=”email” /><br />
What are your comments?<br />
<textarea cols=”30” rows=”10” name=”comment”></textarea><br />
<input type=”submit” value=”Submit this bad boy!” />
</form>
<?php include(“footer.php”); ?>
Step 7: Save this file as mailform.php and FTP it to your directory on vader.lib.umn.edu. Take a look at mailform.php within your browser.
OK, let’s talk about what is happening here. First of all, we started this file with a bit of PHP code, specifically the include() function. As you might imagine, this function will include the text of header.php on mailform.php. Inside of this code we also finally assigned a value to the variable $title. This variable can now be used within header.php. Note how we listed the variable value first, and then we wrote out the include statement. If we did it the other way around, the header would print out before the title variable was set. This would result in an empty $title variable and an incomplete web page.
The middle of the file then contains the main XHTML of the page, including the actual mail form. Note the action of the <form> tag: form-mail.php. We’ll create this next. Lastly we include our footer.php file and the page is finished. Send it through the validator at the W3 and check to see if it validates as XHTML. It should. Can you see the benefit of using PHP includes? As far as headers go, the example used in this lab is pretty lame, but you should see how you can include any bit of XHTML text inside the header such as graphics, navigation bars, even entire “inverted L” architectures, and CSS calls. Once you get your header figured out, put it in an include and never worry about it again. Or, if you do have to worry about it again only worry about it in one place, just like CSS. Let’s move on:
Step 8: Open Notepad and create a New document. Type in the following code:
<?php
$name = $_POST[“name”];
$comment = $_POST[“comment”];
$email = $_POST[“email”];
$title = “Thanks for your comments!”;
include(“header.php”);
$mailTo = “youremail@yourhost.com”;
$mailSub = “PHP class email”;
$mailBod = “Hello, $name ($email) sent you a note and his/her comment is \”$comment\” ”;
$mailFrom = “From: $email”;
mail($mailTo, $mailSub, $mailBod, $mailFrom);
include(“footer.php”); ?>
Step 9: Save this file as form-mail.php and FTP it to your directory on vader.lib.umn.edu. Take a look at mailform.php within your browser and actually fill out the form. Check your email to see if it got through!
So, did it work? Hopefully it did. If not, don’t sweat it. We can figure it out. Let’s take a look at what is happening in this file. First of all, we are creating the variables that come from our form, $name, $comment, and $email. We have to explicitly tell this script to accept these variables from the form we created. For example, $_POST[“name”] is the form text field we named “name” in the XHTML form page that called this script. We then assign the value of $_POST[“name”] to the variable “$name.”
Also, you should notice we are using our header and footer files again. They are already coming in handy! Secondly, we create a number of variables: $mailTo, $mailSub, $mailBod, and $mailFrom. These should be pretty self explanatory. With them we are creating the necessary elements of any email. The recipient, the subject, the body of the message, and who it is from. To do this we are using elements that have come from mailform.php, the form we created above. The $name variable in the $mailBod variable comes from the Name: field in mailform.php above. The $email variable in $mailFrom comes from the Email: field in mailform.php. Note that the variable name comes from the name we used in the <input> tags. For example, Name: <input type=“text” name=“name” />. This is a very important concept to understand since it keeps things understandable. Please let me know if it doesn’t make sense. As we talked about above, we assign the variable $name the value of the contents of the variable $_POST[“name”]. Please also take another look at this line:
$mailBod = “Hello, $name ($email) sent you a note and his/her comment is \”$comment\” ”;
Do you see how we have written out the call to the $comment variable? In this case, we want the comment itself to be enclosed in quotes in the resulting email. But if we just write out quotes around the $comment variable, the server will think we are closing the quote we started when we typed $mailBod = “Hello … So, to get around this we have to “escape” our quotes with the backslash in front of them. This tells the server to treat these quotes as actual parts of the variable value, not as part of the PHP code itself. If we don’t escape these quotes, the script will break and you will get an error message from the server.
Finally, we use another built in PHP function called mail(). The syntax for mail() is first the recipient of the email, then the subject, then the body of the message, then who the email is from. In other words, mail($mailTo, $mailSub, $mailBod, $mailFrom);. This function tells the server to send an email from the email address specified to the recipient email address specified. Next we closed out our script with an include statement for our footer and we are done.
So, is that so hard? Some of you may think so, and that is OK. Programming isn’t for everyone. But for those of you that actually understand all that I’ve included in this lab, this is but the tip of the iceberg when it comes to PHP. Let me know if you are interested in more.