SSI is a language very similar to PHP. SSI stands for Server Side Includes. However, to begin this tutorial, you must know
that your server supports SSI. I don't think there is any free web host that supports this language, and even hosts that
you pay for rarely support SSI. So make sure that you know that your server supports Server Side Includes(SSI).
Step 1:
First things first. SSI ONLY works with ".shtml" extensions. Which means, your index page MUST be "index.shtml" or
"main.shtml". It cannot be ".html" or ".htm". Now with that cleared out of the way, read on to learn SSI!
Okay, you can
realize that most websites have a content section in the middle, and some side panels on the left or right side, normally
with navigation or a news ticker. For example, DBGT.com has their navigation on the left, and their affiliates and a news
ticker on the right. SSI mainly focuses on those side panels.
Step 2: Okay now that you understand what SSI helps out
with, it's time to start. It's your choice how many panels you want, but for this tutorial I'm simply going to make it two,
one on the left and another on the right. So say you want to make a left.html for your navigation, like DBGT.com. Now
simply make a page, called "navigation.html", or "left.html", or whatever you want. On that page ONLY make the left panel
side. Don't make anything else. So now you have that page named as navigation.html or left.html, containing whatever you
wanted on the left side. Go to your layout page, and where you want the left panel, insert this:
<!--#include virtual="left.html"-->
Remember to change "left.html" to the page name, such as navigation.html. Remember,
you could use "left.html"; there is nothing wrong with it.
For the right side, you do pretty much the same thing. Let's
say you want a news ticker on the right side. So make a page with the news ticker coding in it, and whatever other things
for the right side. Save that page as right.html, or maybe newsticker.html or something else that you want. Remember, ONLY
make the content for the right panel, nothing else. Now go to your layout page, and where you want the right panel, insert
this:
<!--#include virtual="right.html"-->
Remember to change "right.html" to the page name, such as newsticker.html.
Remember, you could use "right.html"; there is nothing wrong with it.
Step 3: Now upload everything to your server and
open your layout page where you inserted everything. For example, http://www.your-domain.com/index.shtml. Remember, it MUST
be a ".shtml" page, not a ".html" or ".htm". If you did everything properly, you should get a proper page with the right
and left panel bars that you created. If not, you probably received an error like this:
(an error occured while processing
this directive).
If you do get that error, check everything twice. Make sure you followed every step of the tutorial, and
make sure that your server supports SSI.
You could probably see what SSI is used for now. It also is a very useful tool in
layouts. You could reduce the amount of html you had to write in the snap of a finger. Most websites use SSI or PHP, since
they do almost the same thing. I hope this tutorial has helped you to better understand Server Side Includes(SSI).
|