If you look at the pages on thesitewizard.com, you'll probably notice that there are a lot of text on each page common with the other pages (such as the logo, the navigation bar, the quick menu, etc). Maintaining so many pages with common code or text can be quite a pain when you want to change it. This is where having Server Side Includes (or SSI) on your web server comes in useful.
Server Side Includes (SSI) are especially useful and most commonly used when:
This is a primer designed for those who want to get started with using SSI for the common tasks listed above. It is by no means an exhaustive guide on SSI - I have omitted SSI facilities like setting environment variables, printing the date, etc, in order to focus on the most common use of SSI listed above.
To benefit from this tutorial, you should also know how to create a web page and how to add raw HTML code into that page.
Before you can use the methods given below, your web host must be an Apache server with Server Side Includes (SSI) enabled. You can probably find such information from your web host's documentation. In most cases, your website will probably be hosted on a Unix server (or one of its many clones like Linux or FreeBSD) and not Win2K/XP.
There are a number of reasons why you might want to insert the contents of a file into your web page. As mentioned earlier, one reason may be that you want to put the code or text that is common to all your pages (like your navigation bar) in a single location. That way, when you want to update your (say) navigation menu, you only need to change one file and it will automatically be reflected on all your pages.
To include a file named, say, "commoncode.txt", into a page on your site, simply insert the following line in the web page at the place where you want the contents of commoncode.txt:
Note that there are no spaces between "<!--" and the "#include" directive.
If you place your file in a subdirectory somewhere, you can use the usual relative path. For example, if your commoncode.txt file is placed in a subdirectory called "common", then your SSI directive will look like the following:
Note that the directory separator is the forward slash, "/", as in all Unix systems and not the backslash that you may be accustomed to if you come from the Windows world.
You can put anything you like in the commoncode.txt file that you want inserted into your web page at that point. The SSI directive makes it seem as though your web page contained the entire contents of the included file at the location you put the directive. The entire process is transparent to the visitor who visits your site.
Sometimes you want to insert the output of a CGI or PHP script into your web page. You might want to do this if, for example, you were running a banner rotation script that generates a different set of HTML code on each invocation.
If your script has the name "banner.cgi" and it is located in your website's cgi-bin subdirectory, the SSI directive would look like the following:
Some web hosts allow you to execute any program on the server and include its output on your page. If so, and you wish to run (say) the "/bin/ls" command, you would put a directive like the following:
You will naturally have to use the correct path for that particular program before it will work as desired.
Most web hosts that support SSI directives require that the web pages that use them have a ".shtml" extension. This is because SSI processing takes up processor time and the web host does not want their machine to slowed down by having the web server check every single HTML file for SSI directives. As such, if you want your web page's SSI directives to work, you will need to rename it with the appropriate extension. Check with your web host what this extension is (usually ".shtml").
Some free web hosts parse SSI directives for every single HTML file their server delivers, including ".html" files. Even so, you may still want to consider using the ".shtml" extension for new files so that you can easily move to a commercial host in future without the headache of having to rename your files and updating all the links to those pages.
Even if you think you do not need to use Server Side Includes (SSI) on your site now, I suggest that you plan ahead.
Take a look at your web site. Is it a site that is likely to expand in number of pages? If you're selling a product and have the product description on its own page, does it seem likely that you will be selling more products in the future? If so, you should start using SSI on your site, even though at this point in time, you probably feel it is unnecessary. You'll think differently once your site expands, and you have to update a few hundred pages each time something changes. At that time, changing your pages to a ".shtml" extension and replacing blocks of common code with SSI directives in all your pages will be much more of a hassle than when your site is smaller.
Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at http://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.
This article is copyrighted. Please do not reproduce this article in whole or part, in any form, without obtaining my written permission.
It will appear on your page as: