BeWebmaster

Server Side Includes (SSI) Basics

Ad

SSI (Server Side Includes) are 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.

As an example, imagine you have a large portal web site with links at the top, bottom and sides common to all pages (or a section of pages). To make the site easy to maintain you can have the header, footer, right menu and/or left menu as include files.

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 recalculated every time the page is served. SSI is a great way to add small pieces of information, such as the current time. But if a majority of your page is being generated at the time that it is served, you need to look for some other solution.

How do you use Server Side Includes

Server Side Includes are very easy to use.  All you need to do is create a file which contains the reusable code with the extension .htm, .html, .asp or .php.

If you are using highly confidential ASP/PHP code (or any other web technology), like your database connection string or some business logic, in your include file then make sure the include file is named .asp/.php so that no one can open the include file and see your code.

You cannot use include files in HTM or HTML files, You can use them only in SHTML, ASP, PHP pages, etc. - that support include files.

Now go to the page that will use the include and add the following code in the appropriate place:
SHTML or ASP: <!--#include virtual="/path_relative_to_site" -->
PHP: <?php include("../path_relative_to_document") ?>

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 its results.

The element can be one of a number of things, and we'll talk some more about most of these in the next installment of this series. For now, here are some examples of what you can do with SSI

Today's date

<!--#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.

The SSI directive exec is used to execute scripts. There are the five other SSI directives available and here is what they are and what they do:

config       - sets the error-message format, time, or size (Example above)
echo         - inserts the variable values of an SSI into your web page (Example above)
flastmod  - inserts a date/time stamp of when a file was last updated (Example above)
fsize         - will insert the size of a file into your web page
include    - insert the content of an HTML file into your web page.

Important points to remember while using Server Side Includes

  • All the pages using Server Side Includes must be .asp or .shtml files.
  • The Include itself must not have any < HTML>, <HEAD> or <BODY> tags. The file should only contain the code that has to be included into a file.
  • If you are using ASP code in your include file then make sure the include file is named .asp so that no one can open the include file and see your code.
  • All paths used in the code of an Include file (i.e. images, links, etc.) must be relative to Site root and not relative to document.
  • When you use an Include within a file it must be included relative to Site Root and not relative to Document.

Using Server Side Includes in Dreamweaver

In your page, keeping your cursor in the place where the include file should come, Click on Insert > HTML > Script Objects > Server Side Includes (for MX 2004) or Insert > Server Side Includes (for Dreamweaver 4). In the pop-up window that appears select your include file, give the path as relative to Site Root (for ASP) and click OK.

Conclusion

SSI is certainly not a replacement for CGI, or other technologies used for generating dynamic web pages. But it is a great way to add small amounts of dynamic content to pages, without doing a lot of extra work.