Search the site:
(New search engine!!)

SSI

Let the server do the work for you!

SSI means "Server Side Includes", I'm sure no further explanation is needed…right? Well, you'll get some anyway!

SSI is the lazy web designer's best and most powerful tool. With some simple code this imaginary designer can add external code from another file into one or more HTML pages. Here are a few examples of how it can be used:

Copyright messages that goes into all pages.
Footers.
Adding text uploaded by a client.
Instead of GoLive components.

SSI can do much more stuff than just add the content of one file to another file, but that is the part I'm going to cover in this tutorial.

So, can you always use SSI? No, you probably need to be on a Apache server and often, but not always, you need to use the file extension “.shtml”, like I have on all pages at this site.

If you take a look at the bottom of this page you see a copyright message generated by SSI and you might see a banner or two to the left, it/they are also added by using SSI.

Okay, I'm sure you're now eager to know how this "trick" works. Let's use this page as and example. If we take a look at the source code in GoLive we see this close to the bottom:

This simple code is all you need! Please note that the path to the document containing the copyright text is “virtual”. In other words, it's a path that starts at the root level and goes to the file you want to include. So, it doesn't matter where the “displaying page” is located!

The other part we need to make this work is the HTML document with the copyright text, it looks like this:

Note that there are no head or body tags, only the code we want to display!

When we have uploaded this HTML document to our root folder (it could go into any folder but then the path would look different) we are free to start using the snippet:  anywhere we want on the site.

If we change the content of the included document, let's say we change the year to "2005", that will affect the entire site the second we upload the document to the server. Very powerful stuff!!

A few hints and tips:

If you use something with a path in the included document, like an image, you enter the path from the included document to the image. This is also a "virtual path".

Sometimes it's a very good idea to use SSI instead of GoLive components, the best thing with SSI is that you don't have to upload all affected pages after you made a change, uploading the included document is enough.

You can let a client uploaded a text file (.txt) and have SSI include the custom text.

When the page is viewed in a browser you can't see that some of the content is “external”, the server will incorporate the external content in a seamless way - on the fly.

If you have used CSS (Cascading Style Sheets) this is a bit similar, by making one small change in one document you can achieve a big impact on thousands of documents!

GoLive offers an extension that will enable you to see how the server will present the page, this extension is called "Translate SSI".

Find it in the GoLive > SDK > Samples folder. Copy the “Translate SSI” folder to the GoLive > Modules > Extend Scripts folder and restart GL. Activate the extension under Edit > Preferences > Modules and restart GoLive. If you don't run the "Translate SSI" module the code will display like this in layout view and you will need to test the page on the server.

Want to learn how to display server data in a page? Check out the Echo tutorial!