Server Side Includes Server Side Includes is a technique which allows certain elements of a Web page to exist outside the page itself. Rather than including a header which is the same throughout the site in each page, you can link to a central version. If subsequent change need to be made, one change to the central header will be reflected throughout your site.

How can I include it on my pages?

First of all you need to create the part of the page that you want to be the same across the site. In the case of this page it's the Star Wars logo with some text and a horizontal line:

  • Using a text editor, create the HTML of your generic header. The file should start with <!--Start of server side--> and end with <!--End of server side--> so that you can keep track of where your elements are included.

  • Save this file somewhere in your Web space with an appropriate file name.
    N.B. It doesn't need any kind of file extension.

  • Repeat this process for as many elements as you wish to include in the page.

  • Once you have all the elements you wish to use, you can create the page that pulls them all together. This page must have the extension .shtml (if you use .html the server will not recognise that it has to pull in the external elements).

  • At the appropriate place in your page, link to the element you want to include with a comment line:
    <!--#include virtual=["name of file"]-->

When you load this page up on a browser, you should be able to see your various elements included in the page

Some points to remember

  1. Any HTML tags that are opened in your server side file, must be closed. You can either close them in your .shtml page or, if you are using server side for the footer, in the footer file.

  2. You must give any page which uses Server Side the .shtml extension