Liz & Nigel’s Website

Some occasional articles

menu.html

Detail of the <a...?id> statement

Using PHP

Up until now I have written this website in HTML and CSS, but I have been delving into PHP and have reduced its size from 420MB to 230MB. Each page had its own header, menu, body and footer, but using PHP it’s possible to wrap the body of each page with a common header, menu and footer, as it is opened. The whole website currently has about 2,040 files of which there are about 1,200 image files, leaving about 840 pages of text. Taking out the header, menu and footer from each of those text pages and having just one header, a small number of menus and just one footer used over and over again has pretty much halved the size of the website.

Query Strings and $_GET

I discovered that the <a> tag can have another argument added to it in the form of “key=value”. It’s called a query string because it’s separated from the URL by the “?” character. This extends the use of menu hyperlinks. If you hover over the Thoughts tab in the light blue menu bar you’ll see a drop-down of the three items in that menu. You’re actually looking at the bottom one: “Using PHP”.

Amongst others, PHP has a Superglobal called $_GET. This “gets” anything after the “?” and stores it so that it can be used throughout a website until it’s changed by clicking on something else.

Now look at the image on the left. This is the HTML file of the light blue menu bar that contains the tabs: Home and Thoughts. Look at the line: <a href=“../index.html”>. This is a straightforward hyperlink tag that takes you all the way back to the website home page.

The variation that I’ve used is the line: <a href=“menu.php?id=3”>. In this case the key is “id” and its value is “3”. The id=3 bit enables me to use a switch statement and you can see that working in the image on the right. The important bit is $id = $_GET[ 'id' ]. The id=3 in the menu gets stored by PHP in the variable $_GET['id'] so that it can be used by other PHP programs. In this case the key “id” is set to the value “3” by clicking on an item in the menu on the left, and it is then used by the program on the right to locate Case 3 to set the Previous and Next buttons to go to different pages, the Page to be loaded and the pageTitle displayed at the top of the screen.

All in all I’m quite pleased with the result.

using-php.jpg

Detail of the ‘switch’ statement