What is SSI?
SSI stands for Server Side Includes. As the name suggests, they are simple server side scripts that are typically used as directives inside html comments.
Where to use SSI? There are several ways to SSI. The two most common reason to use SSI are to serve a dynamic content on your web page, and to reuse a code snippet as shown below.
The following html code snippet shows this example. The line highlighted in bold is an SSI script.
The following is a sample header.html file that can be reused.
This is the index.html, which includes both header and footer using server side includes.
Create .htaccess file in your web root and add the following lines of code:
We can also instruct the server to parse the file with custom extensions as well. For example, we can use the following lines for parsing the “.shtml” file extensions.
An example of lines in nginx.conf is as follows:
SSI stands for Server Side Includes. As the name suggests, they are simple server side scripts that are typically used as directives inside html comments.
Where to use SSI? There are several ways to SSI. The two most common reason to use SSI are to serve a dynamic content on your web page, and to reuse a code snippet as shown below.
1. Serve Dynamically Generated Content
For example, to display current time on your html page, you can use server side includes. You don’t need to use any other special server side scripting languages for it.The following html code snippet shows this example. The line highlighted in bold is an SSI script.
<html>
<head>
<title>thegeekstuff.com</title>
</head>
<body>
<p>
Today is <!--#echo var="DATE_LOCAL" -->
</p>
</body>
</html>
2. Reuse the Same HTML Script
You can also use SSI to reuse a html snippet on multiple pages. This is very helpful to reuse header and footer information of a site on different pages.The following is a sample header.html file that can be reused.
<header> <h1> The Geek Stuff</h1> <img href="./images/logo.png" alt="Logo" /> </header>The following is a sample footer.html file that can be reused.
<footer> <span> The Geek Stuff, Los Angeles, USA <span> <ul> <li> <a href="aboutus.html">About Us</a> </li> <li> <a href="contactus.html">Contact Us</a> </li> <li> <a href="ourworks.html">Portfolio</a> </li> </ul> </footer>Now, when it is time to reuse the above two files (header and footer), we simple include them on any other html page using the #include SSI as shown below.
This is the index.html, which includes both header and footer using server side includes.
<html>
<head>
<title>The Geek Stuff</title>
</head>
<body>
<!--#include virtual="header.html" -->
<div>
<!-- Page content goes here -->
</div>
<!--#include virtual="footer.html" -->
</body>
</html>
Similar to including a html page using SSI, you can also include the output of cgi script to the html using the following line:<!--#include virtual="/cgi-bin/sometask.pl" -->
3. Setup SSI in .htaccess File
We can instruct the webserver to interpret Server Side Includes either using .htaccess or modifying the web-server config file directly.Create .htaccess file in your web root and add the following lines of code:
AddType text/html .html AddHandler server-parsed .html Options Indexes FollowSymLinks IncludesThe above lines instruct the web server to parse the .html extension for the server side includes present in it.
We can also instruct the server to parse the file with custom extensions as well. For example, we can use the following lines for parsing the “.shtml” file extensions.
AddType text/html .shtml AddHandler server-parsed .shtmlSimilarly for parsing the cgi script we can add following lines:
AddType application/x-httpd-cgi .cgi
4. Modify Apache httpd.conf File
On Apache web server, the following directive lines should be present in httpd.conf file for SSIOptions +Includes AddType text/html .shtml AddOutputFilter INCLUDES .shtmlThe first line tells Apache to allow the file to be parsed for SSI. The other lines tells the extension of the file to be parsed.
5. SSI On Nginx Web Server
On Nginx web server, SSI should be set to “on” in the “nginx.conf” file settings.An example of lines in nginx.conf is as follows:
location / {
ssi on;
ssi_last_modified on;
ssi_min_file_chunk 1k;
ssi_silent_errors off;
ssi_types text/html;
ssi_value_length 256;
root /var/www;
index index.html
}
In the above Nginx SSI configuration:- First line tells the server to enable the SSI parsing.
- Second line tells the server to keep “Last-modified” field in header.
- Third line states the minimum size of the include file.
- Fourth line suppresses the error message in case of SSI parsing error.
- Fifth line allows the addition of the MIME types.
- Sixth line set the maximum length of the parameter values in SSI commands.
No comments:
Post a Comment