Nerdrium Home



Web Design

Case Mods





My Blog




A Brief Tutorial: Server-Side Includes

by Michael Greifenkamp (June 6th, 2003)

I never knew how I survived being a webmaster before I knew how to use server-side includes, or "ssi." Don't know what include files are? They're quite cool. Basically you can control content on multiple pages with a single text file. The server takes your web pages and adds your include files before sending the finished package back to the viewing browser.

Think of it this way: each page on this website has that silly Nerdrium logo at the top. Each page has code that points to the same file, namely, "/images/nerdrium.jpg". If I make a new graphic called "nerdrium.jpg" and put it in the images directory, what happens? Any page that is called from the server after that time will display the new graphic. I didn't have to make *any* changes to any of the pages that have the graphic on it.

Now imagine that you could do that with more than just a graphic, but rather whole chunks of html code. Neat idea, eh?

Say that you have a "what's new" blurb that will be on every page of your site. Updating tens, or hundreds, or thousands of pages every time something new comes along would be an awful chore, wouldn't it? For example, let's use this short blurb:

<p>Experts say that the White Sox should win the Pennant in 2003.</p>

Rather than copying and pasting that phrase on every page on your website, and having to change each of those pages when it becomes obvious that the pundits have made a mistake, make an include file instead. An include file is just a text file. In this example we'll call the text file "sox.txt". Cut that entire string (from the <p> to the </p>) and paste it into the text file and save it.

Now, being the organizational freak that I am, I have a separate directory on my website called "includes." I would suggest doing the same thing--that way you know right off the bat (ba-dum) how to get to your include files no matter where in the directory structure you are.

Time to add the file to your web page! Go back to where you had cut and pasted the line of html and insert this instead:

<!--#include virtual="/includes/sox.txt" -->

Note that there is a space between the second " and the -->. That space must be there or it won't work (that's what I've been told, anyway...).

Now anytime that web page is loaded the server will quickly retrieve the contents of sox.txt and insert whatever it contains into the web page and then send it to the browser to be rendered. :)