Here is a real-life example of server-side include codes in action.

If at all possible, print each of the four items below so you can look at them all at once. Please number them 1-4, as listed below, so I can refer to them easily. All three graphics below are different views of the same file, http://www.inform.umd.edu/EdRes/index.html. NOTE: This example is still valid though it refers to a legacy server called "inforM."

The fourth graphic is a special one. It is the include header file as seen in Web Spinner. This is the file that is inserted in by the inforM server automatically, each time the page is loaded.

The style of this page as seen in a browser (the header, footer, and grey bar along the side) is entirely provided by server-side includes. We're going to be looking at the header (the part with the title, webglobe, and black horizontal line). Notice how in the WebSpinner graphic, you can see some funny code at the top and bottom of the file. Notice how in your browser's View Source, you don't see it, you just see regular html. That's because when the server sees the funny code (hereafter "include code"), it goes and gets the specified include file, and inserts it into what the browser looks at. Kind of like a word processing "macro." So by the time the browser sees the file, the include code is gone, and has been replaced with the HTML found in the include file. The "server-side include" statements at the beginning and end of the html documents are codes that tell the inforM server where to put in the header and footer and what to put in for specified variables. The fourth graphic you printed out is what the header's include file looks like in Web Spinner. It should look familiar - it is exactly what you see at the top of the View Page Source.

The advantage of this is that if you want to change something on every page, only the special include files (i.e. one for header, one for footer), need to be changed. Since the server inserts the include files at the beginning or end of every html document in your directory every time the page is loaded, sweeping changes can be made instantly. For example, if the URL of one of the navigational links at the bottom of every page changed, only the include files would need to be updated.

Take me back to the referring page

Take me back to the front page

Do let us know if we can edit this guide to make it more helpful for those who will come after.