May 05 2009
Posted by Webmasters-central.com as Web Design
You have a five page web site. Now you want to add an extra link to your footer area of five pages. No problem…
Open them in your html editor or Note pad and add that link. You might be finished in 5-10 minutes.
What if you have 10 or 50 page web site? It will take forever to edit a link on all of the 50 pages. Here comes SSI … How can you do that?
Step 1 :
First design a lay out for your web pages on a paper. Here is an example layout. You can see one header area, one footer area and two side bars. Design it in a way you like. If you want one more area below header, you can include something like ‘header2′ etc.
Step 2 :
Now you have to create a template for your web pages.
That template should consists of four SSI tags(in this case). One for header area, one for footer area and two for the two side bars.
When I finish my html code for the above example it looks like:
——————————————————-
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd“>
<html>
<head>
<meta content=”text/html; charset=ISO-8859-1″
http-equiv=”content-type”>
<title></title>
</head>
<body>
<table style=”text-align: left; width: 90%;” border=”0″ cellpadding=”2″ cellspacing=”2″>
<tbody>
<tr>
<td style=”text-align: left; vertical-align: top;” colspan=”3″>
<!–#include virtual=”/header.txt”–>
</td>
</tr>
<tr>
<td style=”width: 20%; text-align: left; vertical-align: top;”>
<!–#include virtual=”/leftbar.txt”–>
</td>
<td style=”width: 60%; text-align: left; vertical-align: top;”>
YOUR TEXT HERE! <br>
<br>
</td>
<td style=”width: 20%; text-align: left; vertical-align: top;”>
<!–#include virtual=”/rightbar.txt”–>
</td>
</tr>
<tr>
<td style=”text-align: left; vertical-align: top;” colspan=”3″>
<!–#include virtual=”/footer.txt”–>
</td>
</tr>
</tbody>
</table>
<br>
</body>
</html>
——————————————————-
If you copy and paste the above html code in your template and keep your text there.
Tips in creating these templates:
You can keep footer.txt, header.txt, sidebar.txt etc., instead of footer.htm, header.htm and sidebar.htm.
1. Always left the background color white. Because once you put up the 50 web pages and you don’t want that background, you have to update those 50 pages. So all the colors you want to keep, put them in your styles.css file.
2. Seperate the html code with some clear spaces so that you won’t be confused after looking at it.
3. Always you have to name these web pages where you keep SSI tags as ‘.shtml’ extentions, unless your host supports ‘Apache Handlers’. This is because, you are telling the server that these are the pages that have to parse them before sending to the browser.
4. Always keep the files that you include by SSI in root directory and use the ‘virtual’ SSI tag to include these files.(’exec’ method in not necessary because, you are just including the files not executing the some CGI script).
5. If you want second bar in future but not now, you can add second bar as usual and upload some empty file with sidebar2.txt name. In future you can alter your sidebar2.txt. If you don’t upload any file that was included in SSI tag, you will get ‘[error occurred in processing this directive]‘ message on the web page.
Step 3 :
Upload template as index.shtml and upload the header.txt, footer.txt, leftside.txt and rightbar.txt to your root directory.
All you have to do is pasting the text in the appropriate place.
If you want to add a link or delete a link you can open footer.txt or leftbar.txt and do it. Your whole site reflects the changes.
Author: Radhika (c)
http://www.webmasters-central.com/
| M | T | W | T | F | S | S |
|---|---|---|---|---|---|---|
| « Jun | ||||||
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 | 31 | ||
2 Responses
Seeja Rose
June 1st, 2009 at 3:11 am
1Hello Radhika, I am trying to add footer.txt as an include file….I put this tag in the body where the footer should show up …..saved the index page as shtml……and the footer .txt file with the following content
Footer text
is saved in the same folder as the index page…. .I don’t know whats gone wrong….b’cause for some reason the footer text is not showing in any of the pages……Please help
Webmasters-central.com
June 1st, 2009 at 11:25 am
2Hi Seeja,
1. Copy the following tag exactly and paste it.
< !–#include virtual=”/footer.txt”–>
2. Ask your host that you can use SSI or not.
3. Clear temporary internet files, close the browser or restart computer and check the web page again. (Especially with IE)
4. Check the web site from another computer or browser.
If you have used correct include tag, my guess is reason 3 above might be stopping you to view footer.txt file.
RSS feed for comments on this post · TrackBack URI
Leave a reply