SSI Tutorial Server - the computer where your web pages are stored. Side - distinction between (client side) and (server side). JavaScript commands for example make your web browser do some sort of work on the (client side). (Server Side) commands, on the other hand, occur within a program that runs on your server, not your browser. Includes - some action is taken by your web server thereby generating output that is included in the html document that is served up to a browser.

Server Side Includes Tutorial

SSI - Enabling SSI - Examples SSI - Comments SSI - Commands

SSI - Creating Buttons SSI - Formatting Dates SSI - Execute Programs SSI - Including Files

SSI Enabling

If your server is already SSI enabled, all that needs to be done to call SSI from any web page is to give the web page a file name extension of .shtml instead of the usual .html or htm. This causes the SSI enabled server to scan the web page looking for comments which are, in fact, commands that tell the server to perform certain tasks before it displays the web page. This process of scanning the page is known as parsing.

---

---

Comments:

The syntax for the comment in the .shtml file is:
    <!--comment -->
This comment tag allows a web page designer to insert comments into the .html or .shtml file without having those comments displayed when the browser serves up the page.

Any <!--#comment --> which includes the # pound sign is interpreted by the SSI enabled server as a command rather than as a comment. Since it is in the form of a comment, it does not get displayed by the browser. Since it has the pound sign it is interpreted as a command and the results of that command are then displayed by the browser. Commands can vary widely from server to server but the 'echo' command is one of the most common. "Echo" returns to the .shtml document the results of the command.

---

Commands:

The above six echo commands on the left created the outputs shown on the right. The echo command tells the server "Server! echo back this system's variable known as DATE_LOCAL (etc.) and include it in this shtml file where this <!--#comment --> tag is placed."

---

Creating a Back Button

In the second example above we used the <!--#echo var="HTTP_REFERER" --> to show the link that was used to get here. This command can be used in conjunction with the linking <a href="...."> anchor tag to create a return link or "Back Button".

With this command anyone surfing the web can return to the page from which they came. If however they typed the URL name directly into the browser's address window then in this case (none) would appear as the "HTTP_REFERER".

The syntax for creating a back button is:
<a href="<!--#echo var="HTTP_REFERER" -->">BACK BUTTON</a>

---

Configuring Dates

The date's configuration can be altered with a #config timefmt= command.

The dates above have the following format:

     Monday, 01-Jan-2001 12:30:02 EST

To change the date display to the following:

     Mon 01 Jan 01

Use this config format:

<!--#config timefmt="%a %d %b %y" --> <!--#echo var="DATE_LOCAL" -->

We are still using the <!--#echo var="DATE_LOCAL" --> command but just prior to it, we inserted another command that  looks like this <!--#config timefmt="%a %d %b %y" -->  All DATE_LOCAL commands that  follow after this config timefmt line will reflect the same look. Unless another config timefmt command is encountered, like below.

---

To have the date display as the following:

     Monday January 01 2001

Use this config format:

<!--#config timefmt="%A %B %d %Y" --> <!--#echo var="DATE_LOCAL" -->

This was accomplished by placing the following config timefmt line just prior to the DATE_LOCAL command <!--#config timefmt="%A %B %d %Y" -->   We just moved the d% (day) command to another location and capitalized some letters in order to display the full name and year.

---

To display in this format:

     01/01/01

Use this config command:

<!--#config timefmt="%m/%d/%y" --> <!--#echo var="DATE_LOCAL" -->

This was accomplished by manipulating the config timefmt line like this <!--#config timefmt="%m/%d/%y" -->   We've used the abbreviated month, day, year and separated them with forward slashes (/) which are displayed as literals. All other characters, such as spaces, slashes (/), periods (.), and commas (,) are also printed as literals.

---

Date and Time codes:

---

SSI - Execute Programs

You can execute a cgi script from an SSI enabled web page by incorporating it in the command. The syntax for this command is:

<!--#exec cgi="scriptname.cgi" -->

This could be used to call a cgi script that in turn calls a header.txt file which would then display the results of the header file in the location that the <!--#exec cgi="scriptname.cgi" --> command is placed. With this method you will need to set the permissions of the cgi file to chmod 755.

---

SSI - Include File

'Include' is another SSI command and it uses the 'file' attribute. This can be a very useful SSI call since some server's and host administrator's won't allow the use of the SSI command 'exec' mentioned above. With the 'include file' command you can include a text or html file into your shtml file. This gives you the ability to create headers and footers without using cgi scripts.

The syntax for this comment tag is <!--#include file="myfile.txt" --> or <!--#include file="myfile.html" -->

Example:
We have a header file called "header.txt" and in this text file is,

falls mainly on the plain.

Our SSI enabled web page called "spain.shtml" contains;

<html>
<head><title>Spain</title></head>
<body>
The rain in Spain <!--#include file="header.txt" -->
</body>
</html>

The SSI enabled web page (spain.shtml) would look like this in a browser,
            The rain in Spain falls mainly on the plain

This small example can be extended to include any sized header or footer file. Simply create the header or footer and name it header.txt and call it with the include command <!--#include file="header.txt" -->. While the header and footer can have the extension .txt or .html, the SSI enabled web page must have the .shtml extension in order for the server to scan the page looking for SSI commands. It is a good idea to make the header/footer file a .txt file rather than an .html file. HTML tags can be placed in the header.txt file and the .shtml page will insert the commands into it's page just as if they were part of the original .shtml page.

Include Virtual
If you wish to place an .shtml file in one directory and have it call a header.txt file or any file in another directory, use the include virtual= command to accomplish this. The syntax is <!--#include virtual="/header.txt" -->. Note that there is now a slash before the /header.txt file name this is calling the header.txt file in the user's home directory from any other directory.

If you encounter an error message such as;

• [an error occurred while processing this directive]

Then it's because you need to use the include virtual method.

A   B   C   D   E   F   G   H   I   J   K   L   M   N   O   P   Q   R   S   T   U   V   W   X   Y   Z

Home      Portfolio