Configuring your server to permit SSI
SSI (Server Side Includes) is directives that are placed in HTML pages, and evaluated on the server while the pages are being served. They let you add dynamically generated content to an existing HTML page, without having to serve the entire page via a CGI program, or other dynamic technology.
The decision of when to use SSI, and when to have your page entirely generated by some program, is usually a matter of how much of the page is static, and how much needs to be processed every time the page is served.
SSI is a great way to add small pieces of information, such as the current time or standardized HTML page footer information to multiple HTML pages.
Do remember, that if all your page content is being dynamically generated at the time that it is served, then this approach while it will work is not the right approach.
Use of SSI
SSI can be used for many great things! Their primary uses are to provide interactivity to a website and to aid site maintenance!
For example, content which is common to all your web pages can be placed in a single document and then included on ALL the HTML pages. To make any changes you only need to modify this source document.
This is ideal for site navigation or copyright notices which are usually on all pages. Having this content in a single file means changes can be done very quickly without having to modify 10, 20 or 50 separate documents.
It can be used for displaying document information such as document name, URI, last modified date, file size.
Using the “echo command” you can ‘echo’ environmental variables, user information such as IP address or browser information! You can redirect visitors to a page depending on what browser version they are using. You can check what country they are from and display a custom message in their language!
There are almost endless uses for SSI.
Enabling SSI On Your Server with .htaccess
If you are paying for hosting services you may need to get permission from your host to make sure you are not violating their Terms of Service which could result in you getting the boot! Every decent host supports SSI but double-check to make sure.
To enable SSI, either create a file named .htaccess or edit your existing .htaccess file and place the following code in it:
AddType text/html .shtml .shtm .htm .html
AddHandler server-parsed .shtml .shtm .htm .html
Options Indexes FollowSymLinks Includes
Note: to enable SSI for your full web site place the .htaccess in the root directory of your site; to enable it for just a certain directory place the .htaccess file only in that particular directory.
The first line of the code above tells the server that .shtml, .shtm, .htm and .html are valid extensions. The second line adds a handler to all pages with the .shtml , .shtm, .htm and .html extension which tells the server to parse (process) the document for server side includes.
If you want to use SSI within your default directory page, such as index.shtml you may (but normally won’t) need to add the following to the .htaccess file:
DirectoryIndex index.shtml index.htm
This means that index.shtml can be your default page. If this page is not found, the server will look for index.htm and so on.
One disadvantage to this approach is that if you wanted to add SSI directives to an existing page, you would have to change the name of that page, and all links to that page, in order to give it a .shtml extension, so that those directives would be executed.
The other method is to use the XBitHack directive:
XBitHack tells Apache to parse files for SSI directives if they have the execute bit set. So, to add SSI directives to an existing page, rather than having to change the file name, you would just need to make the file executable using chmod.
chmod +x pagename.html
You’ll occasionally see people recommending that you just tell Apache to parse all .html files for SSI, so that you don’t have to mess with .shtml file names. These folks have perhaps not heard about XBitHack. The thing to keep in mind is that, by doing this, you’re requiring that Apache read through every single file that it sends out to clients, even if they don’t contain any SSI directives. This can slow things down quite a bit and is not a good idea.
Of course, on Windows, there is no such thing as an execute bit to set, so that limits your options a little if you’re running Apache on Windows.
In its default configuration, Apache does not send the last modified date or content length HTTP headers on SSI pages, because these values are difficult to calculate for dynamic content. This can prevent your document from being cached, and result in slower perceived client performance.
There are two ways to solve this:
- Use the XBitHack Full configuration. This tells Apache to determine the last modified date by looking only at the date of the originally requested file, ignoring the modification date of any included files.
- Use the directives provided by mod_expires to set an explicit expiration time on your files, thereby letting browsers and proxies know that it is acceptable to cache them.
Basic SSI Directives
SSI directives have the following syntax:
<!–#element attribute=value attribute=value … –>
It is formatted like an HTML comment, so if you don’t have SSI correctly enabled, the browser will ignore it, but it will still be visible in the HTML source. If you have SSI correctly configured, the directive will be replaced with the results of the directive.
There MUST NOT be a space between the ‘#element’ and the second opening ‘-‘ and there MUST BE a space between the last character of the last ‘attribute=value pair and the first closing ‘-‘.
The element types are:
|include||In-line inclusion of files including nested files.|
|flow control||IF, ELIF, ELSE, ENDIF constructs for conditional processing.|
|set||Sets variables that may be used by CGI or SSI processing.|
|printenv||Displays all current variables.|
|echo||Displays contents of a variable.|
|exec||Executes a shell or cgi script|
|fsize||Provides the size of a file.|
|flastmod||Last modification date of a file.|
|time & date||Time and date formats.|
<!–#echo var=DATE_LOCAL –>
The echo element just spits out the value of a variable. There are a number of standard variables, which include the whole set of environment variables that are available to CGI programs. Also, you can define your own variables with the set element.
If you don’t like the format in which the date gets printed, you can use the config element, with a timefmt attribute, to modify that formatting.
<!–#config timefmt=”%A %B %d, %Y” –>
Today is <!–#echo var=DATE_LOCAL –>
Modification Date of the File
This document last modified <!–#flastmod file=”index.html” –>
This element is also subject to timefmt format configurations.
Example : Including a standard footer in every page
If you are managing any site that is more than a few pages, you may find that making changes to all those pages can be a real pain, particularly if you are trying to maintain some kind of standard look across all those pages.
Using an include file for a header and/or a footer can reduce the burden of these updates. You just have to make one footer file, and then include it into each page with the include SSI command. The include element can determine what file to include with either the file attribute, or the virtual attribute. The file attribute is a file path, relative to the current directory. That means that it cannot be an absolute file path (starting with /), nor can it contain ../ as part of that path. The virtual attribute is probably more useful, and should specify a URL relative to the document being served. It can start with a /, but must be on the same server as the file being served.
<!–#include file=”footer.shtml” –>
I’ll frequently combine the last two things, putting a LAST_MODIFIED directive inside a footer file to be included. SSI directives can be contained in the included file, and includes can be nested – that is, the included file can include another file, and so on.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”><br /> <head><br /> <meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>Apache – Server Side Includes</title>
<!– Content Section –>
<div class=”divContent”><br /> Page Content<br /> </div><br /> <!– Footer Section –><br /> <!–#include file=”footer.shtml” –>
<!– standard footer full width –>
<!– set time format to 4 digit year –>
<!–#config timefmt=”%Y” –>
© 2011 – <!–#echo var=”DATE_LOCAL” –> Ivan Bayross, Inc.
<!– format date –>
<!–#config timefmt=”%B %d %Y” –>
Page modified: <!–#echo var=”LAST_MODIFIED” –>.