Welcome to my 'small slice of web programming' page.

One of the items that I fought with for some time is prototyping and building this website. The engineer in me wanted a method of testing it on my machine, then having it work flawlessly when it was uploaded to my ISP's servers.

A problem with a straightforward implementation of a site is that when testing it on your own machine, the links are not the same as those needed when the page goes live. For instance, the main webpage might be on "D:\Documents\website\index.html", whereas on the web this needs to point to "http:\\www.randommonkeyworks.com\index.html." This is not a problem if you do every link as a relative link, but common headers, footers, and menus will not work correctly site-wide using relative links — the only links that will work are those at the same directory level as the page you originally created the relative link on.

Another design issue is that I wanted a method of quickly changing the major design elements on all (or almost all) of the pages on the site, so that it is easy to make everything have the same look and feel.

After a lot of study and false starts, success was mine – the evidence is the page you are reading.

If you are in a similar position, and you don't have a host that allows ASP, .NET, or another newer technology to be used, the following may help you out.

As can be seen by the this page's extension, the solution involved PHP. In conjunction with Apache, PHP allows one to completely build the site on their computer, check all the links, and then have everything work correctly when it is uploaded to their ISP. It is not quite as simple as that, though, because some PHP programming is also necessary.

Before I get into the programming technicality, let me quickly outline installing Apache and PHP.

Matthew Phillips has specified how to install these programs in an article on devarticles.com. It is not necessary to install MySQL for the work we are doing, but if you want a database on your site, and your host allows it on their end, feel free to put it on your computer as well.

The point I want to add to Phillips' instructions is that if you use the .msi installer when installing the newer versions of PHP, you don't have to go through the hassle of setting up Apache to integrate PHP – the installer will do it for you. But if you want to put your website on a different directory than the default Apache location, you will need to modify the httpd.conf file.

Now for the programming.

The first of my design goals can be accomplished by creating a variable that points to the appropriate document root. As that variable is held in a file, two different versions of that file (one on my ISP's website, and the other on my hard drive) allow my site to work differently depending upon where it is located.

Of course, that is not all there is to it, as many on-site links within my pages need to be modified. (By 'on-site link' I mean a link that points to a page within my own site, not one that goes elsewhere.) Not all links need to be changed, because you can still use relative links for many portions of the code, but all links in the common header and footer files do have to be PHPd, as it were.

By 'PHPd', I mean that those links need to be inserted as a PHP command. In my case, a link to my book is actually encoded like this in html:

   <?php	echo "<a href='".$workRoot."latd/latd.php'>LATD</a><br>"; ?>

This causes the server (Apache on my macine, or whatever my ISP uses on their machine) to parse this, and insert the value of the 'workRoot' variable before the "latd/latd.php".

That variable is placed in a file that is loaded in the beginning of every page, before the common header file. In my case, the file is called 'rmwVars.php', and it looks like:

<?php
	//Uncomment the appropriate lines.  For my computer and the web,
	$docRoot=$_SERVER["DOCUMENT_ROOT"]."/";
	
	//Don't really understand why we have to have two different
	//ways to refer to the same address, but for my computer:
	//$workRoot="http://localhost/";
	
	//For the website:
	$workRoot = "http://www.randommonkeyworks.com/";
	?>

I don't recall the exact reasons for having two variables that are so closely related, but looking through a page of code, I see that 'workRoot' is used when inserting links to other pages, and 'docRoot' is used when inserting header and footer files. I do recall that that lesson involved a lot of grumbling on my part, as well as some profanity being used, but I got it to work in the end, and that is all that matters.

You can probably tell that on my computer, the '$workRoot' variable under the '//For the website:' note is commented out, and the other variable is uncommented.

For your information, the line for inserting the common header reads:

   <?php include ($docRoot."common/header.php"); ?>

Before continuing, I should mention a fact that caused a couple hours of frustration on my part. When originally trying to get PHP to work on my ISP, nothing I did was successful, so I gave up on it, and continued using an older, and vastly inferior method to this one. (It involved shtml and Javascript, and I am glad to be rid of it.) A year or two later I had a chance to get back to this, and tackle it again. But the same thing happened — PHP just wouldn't work, even though I did exactly what the examples I was looking at said to do.

Finally, I called my ISP, and asked what was going on. A technician and an hour later, I finally found out that all that was needed was to give the page with the script the extension of '.PHP.' Duh! But I didn't feel too bad, because a) that fact is never mentioned on any of the PHP example pages I came across, and b) it took people who should have known this an hour of their own to figure it out.

And with that, I believe I have covered enough that you can figure out how to create your own site in the same manner, if you choose to. Even though I haven't covered the header and footer files in detail, you should be able to figure out what goes into them, and do something similar. For your information, the header includes the side banner with links, and the footer basically only has the copyright notice in it. (It also closes some tables that were started in the header, but maybe I shouldn't mention that, just in case you happen to be a table purist. A lot of study didn't reveal how to create this design more easily using straight CSS.)

Happy coding!

Comments? Post them here.