more dynamic sites through PHP

A couple of reasons to use PHP in your site:

Separation of content from design–when you want to change the look of your page, you can update a few files and every page of your content will be updated with those changes.
You have more power than if you used some language such as JavaScript, because it doesn’t matter what the visitor has enabled in his browser.

Requirements

You need PHP support on your server. An easy way to test this is to stick phpinfo(); into a .php file, upload that file to your server, and load it in your browser. If you get a huge table with information about your PHP setup, then you know you have PHP support. If you get a blank page, then you don’t have PHP. :(
You should have a basic knowledge of HTML for this tutorial. Knowing some CSS would help too, as I mention classes and stylesheets later on, but it’s not required.

Getting Started

Get a blank file and save it as index.php. Put this into it:

  
  <?php if (array_key_exists('page', $_GET)) {
     $pageChoice = $_GET['page'];
} else $pageChoice = "";

switch ($pageChoice) {
     case "me":
          $title = "About Me";
          $file = "me.php";
          break;
     case "links":
          $title = "My Links";
          $file = "links.php";
          break;
     default:
          $title = "My Web Site";
          $file = NULL;
} ?>

<html>
<head>
<title><?php echo $title; ?></title>
</head>
<body>

<h2>Navigation</h2>
<ul>
     <li>
      <?php
      if ($file != "me.php";)
           echo "<a href=\"?page=me\">About me</a>\n";
      else
           echo "<span class=\"selected\">About me</span>\n";
      ?>
     </li>
     <li>
      <?php
      if ($file != "links.php";)
           echo "<a href=\"?page=links\">Links and stuff</a>\n";
      else
           echo "<span class=\"selected\">Links and stuff</span>\n";
      ?>
     </li>
</ul>

<?php if ($file) {
     echo "<h1>" . $title . "</h1>\n";
     include $file;
} else {
     echo "<p>This is the index page!</p>\n";
} ?>

</body>
</html>

The General Idea

What we’re doing is changing how the page looks based on what argument the visitor passes to the file. That’s what our $pageChoice variable is used for. If one goes to index.php?page=me and “me” is a case that exists in our switch, then the $title that is defined in the “me” case will get displayed, and the $file that is defined in the “me” case will be included afterwards. The navigation list will change based on which page the visitor is on (i.e. which argument the visitor passes to the file; if he passes ?page=me, then the navigation will be different than if he passed ?page=links).

Explanation by Parts

<?php begins a block of PHP code. If you want to use some PHP, you must first start out with this. ?> is how you signal that you’re done with PHP code for now. Think of <?php as the equivalent of an opening tag (e.g. <body>) and ?> as the equivalent of a closing tag (e.g. </body>).

1
2
3

if (array_key_exists('page', $_GET)) {
     $pageChoice = $_GET['page'];
} else $pageChoice = "";

This checks to see if there is some string of stuff at the end of the URL the visitor went to. If that string is something like ?page=whatever, then we let our $pageChoice variable equal whatever so we can work with it later. This will be used with our switch to set a few other variables, depending on what whatever happens to be.

`switch ($pageChoice) {`

This is the beginning of our switch. It’s like a big if-else statement in that, depending on the case we’re working with, different things will happen. The case is what we got earlier and stuffed into our $pageChoice variable.

case "me":
     $title = "About Me";
     $file = "me.php";
     break;

This is one particular case, specifically the one for a page about me. If the visitor went to index.php?page=me, then $pageChoice would be set to “me”, which is the name of this particular case. We define a few other variables here (i.e. $title and $file) that will be used later. The break; signals the end of our case.

default:
     $title = "My Web Site";
     $file = NULL;
}

This is our base case. It will be the selected one if none of the other cases match. Since our case choice comes from the $pageChoice variable, if that variable doesn’t match any of the listed cases, then this default case is the one we go with. Its $title and $file variables will be used for the main (i.e. index) page of our site. We set $file equal to NULL to signify that there is no separate file that we want loaded in when we’re on the index page. Note that the default case does not have a break; statement, as it is not necessary.

  
  <html>
<head>
<title><?php echo $title; ?></title>
</head>
<body>

This is just plain HTML code that we want at the top of our pages. The beauty of PHP is that it can be mixed in quite easily with regular HTML. We ended our switch just above this, slapped in a ?> to end our PHP, then threw in this HTML but also put in some more PHP code with <?php echo $title; ?>. That little bit will display the title of the page (as defined by the $title variable, depending on which case was selected).

<li>
  <?php
  if ($file != "me.php";)
    echo "<a href=\"?page=me\">About me</a>\n";
  else
    echo "<span class=\"selected\">About me</span>\n";
  ?>
</li>

This is an item in our bulleted list that displays something different depending on which page you’re on. For example, if you’re on the “About me” page, then this particular bit of code will display just the words “About me” (to be styled to your liking based on how you configure the class “selected”, of course). However, if you’re on any other page, then you’ll see a link to the “About me” page.

Notice how there is a \ in front of the double quotes inside the echo statement. Those are necessary unless you want to get an ugly PHP parse error displayed on your otherwise pretty page. Notice how we form our echo: echo "...some stuff..."; We define the beginning and end of what will be echoed (i.e. displayed) with double quotes, and therefore, we cannot have double quotes inside what we’re echoing unless we treat them differently. We stick a \ in front of " if it’s inside PHP’s double quotes to signify that we want that quote to actually show up, and that it’s not really part of our PHP code. This is called “escaping a character”, specifically “escaping a quote.”

Also notice that there is a \n at the end of the echo statements. That’s so that our page’s source code will look neater. The \n sticks in a new line, so that when we view the source of the page, we won’t see everything crowded onto one long-ass line.

<?php if ($file) {
     echo "<h1>" . $title . "</h1>\n";
     include $file;
} else {
     echo "<p>This is the index page!</p>\n";
} ?>

This displays the page title (as defined by the $title variable, like before) and includes a file (i.e. displays the contents of that file). If $file isn’t defined (e.g. it’s equal to NULL, like with our default case, which we used for our index page), then we display the message “This is the index page!”.

The Files

Your me.php and links.php files shouldn’t have any of the usual <body> or <html> tags in it, since those are already here in your index.php. Likewise, you won’t need to put the “Navigation” section in your other files because it’s also here in index.php, and all of your files will be displayed through this one index.php. Therefore, all you need in me.php and links.php is the content specific to those pages.

An example of how me.php might look:

  
  <p>I am an octopus.  I like reading, programming, and web design.</p>
<p>Some of my favorite bands are Nine Inch Nails, Rammstein, and Portishead.  Here is a photo of me:</p>
<p><img src="images/me.jpg" alt="A photo of me"></p>

Notice how I didn’t escape any quotes here, as it’s not necessary. The contents of this file will be displayed as-is. You can use PHP code in here, since it is a .php file, but you certainly don’t have to. I usually make my files .php files on the off chance that I decide to use some PHP in them later on.

Other Suggestions

Define other variables in your cases. You don’t have to use just what I have (i.e. $title and $file)–go crazy! If you want a different stylesheet loaded in when you’re on your page about the Mayan empire, make yourself a variable in your "mayan_empire" case called $stylesheet, do a test to see if $pageChoice equals "mayan_empire", and include that stylesheet!

The case

case "mayan_empire":
     $title = "The Mayan Empire";
     $file = "pages/maya.php";
     $stylesheet =  "css/maya.css";
     break;

The test

1
2
3

if ($pageChoice == "mayan_empire") {
     echo "<link rel=\"stylesheet\" href=\"$stylesheet\" type=\"text/css\">\n";
}

You’re not limited to having only one switch nor to passing only one argument to the file. You might have a second switch to determine which stylesheet to use, for example.

The switch setup

if (array_key_exists('css_file', $_GET)) {
     $styleChoice = $_GET['css_file'];
} else $styleChoice = "";

switch ($styleChoice) {
     case "red":
          $style = "red.css";
          break;
     default:
          $style = "blue.css";
}

Passing multiple arguments

To pass multiple arguments in a link, the first argument begins with a question mark, and all following arguments begin with an ampersand. Example:

  
  <a href="index.php?page=me&amp;css_file=red">About me</a>

Three till Seven

Search results: