Solved

Using SSI & SHTML to create left and right column navigation bars

Posted on 2001-06-25
14
208 Views
Last Modified: 2010-04-09
Hello,

I know how to use server side includes and SHTML to create top and bottom navigation systems on all my pages.

But for a different client I want the navigation to be on the left.  And also have an informative column on the right of the main center body text on the web pages.

Is it possible to use server side includes and SHTML to do this?  If so, how do I set it up.

Thanks

Rowby
0
Comment
Question by:Rowby Goren
  • 3
  • 3
  • 3
  • +3
14 Comments
 
LVL 19

Expert Comment

by:webwoman
ID: 6224599
Sure, you just have to put them in a table. Make a table, left cell holds the SSI for that navigation, center holds content, right holds whatever needs to go there -- I'm assuming another SSI. I do this all the time (though I don't use the right column...cuts down too much on the amound of space for content).
0
 
LVL 1

Expert Comment

by:Ernest022699
ID: 6226341
What webwoman suggests will work, and I suggest that you take very seriously her comment about a right column.  But, ...

Why not use frames?  You don't need SSIs or SHTML (unless you are doing something extra special which you aren't mentioning).
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 6226354
Hi webwoman,

I think I "get it".  But need a bit of clarification.

Do I make the table on the page that is to receive the ssi or do I make the table on the page that holds the ssi, that is to be "fed" into all the other pages.

Can you give me an SHTML/HTML example(s) of what you mean.

Thanks

Rowby

Hi Ernest, yes I could use frames, but I would like to see how SSI/SHTML would handle this particular situation
0
Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 3

Accepted Solution

by:
rag2000 earned 100 total points
ID: 6227885
rowby:

"... Do I make the table on the page that is to receive the ssi or do I make the table on the page that holds
the ssi, that is to be "fed" into all the other pages ..."

There are many ways of going about this... what I would suggest is that you create your template page first complete with all the elements that need to go on every page of the site. Don't add the dynamic content now, just the static content.

see my example below:

templatePage.html
-----------------

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#FFFFFF">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="3"><!--#include virtual="topHeader.txt" --></td>
  </tr>
  <tr>
    <td width="20%"><!--#include virtual="leftNavigation.txt" --> </td>
    <td width="60%">&nbsp;</td>
    <td width="20%">right bar</td>
  </tr>
  <tr>
    <td colspan="3"><!--#include virtual="bottomFooter.txt" --> </td>
  </tr>
</table>
</body>
</html>

topHeader.txt
-------------
      <p>&nbsp;</p>
      <p align="center">top header</p>
      <p>&nbsp;</p>

bottomFooter.txt
----------------
      <p>&nbsp;</p>
      <p align="center">bottom footer</p>
      <p>&nbsp;</p>

leftNavigation.txt
------------------
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td>left navigation table</td>
        </tr>
        <tr>
          <td>option 1</td>
        </tr>
        <tr>
          <td>option 2</td>
        </tr>
        <tr>
          <td>option 3</td>
        </tr>
        <tr>
          <td>option 4</td>
        </tr>
        <tr>
          <td>option 5</td>
        </tr>
        <tr>
          <td>option 6</td>
        </tr>
        <tr>
          <td>option 7</td>
        </tr>
        <tr>
          <td>option 8</td>
        </tr>
        <tr>
          <td>option 9</td>
        </tr>
      </table>

"... I would like to see how SSI/SHTML would handle this particular situation ..."

perfectly!!!
0
 
LVL 18

Expert Comment

by:bruno
ID: 6233308
>>Why not use frames?  


BLAH


:-)
0
 

Expert Comment

by:jgeoff
ID: 6235276

Here's one example...

On the site I did at MobPosters.com I have an SSI for the left nav column and an SSI for the footer. The entire page template is a table with the left nav SSI in the first TD, and the content in the second TD. At the bottom of the second TD, I included the footer SSI. If you wanted to use a third column, just create the TD with the SSI you want (just like the first column).

You can view source there to see how it falls together...

~JG

0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 6235542
Hi everybody. I am reading your comments and will get back to all. (FInsihing a website on deadline!)

I'll return on Fri or sat am.

Thanks again!

Rowby
0
 
LVL 1

Expert Comment

by:Ernest022699
ID: 6236362
brunobear: I'm confused by your "BLAH" comment, but I want to take it seriously and learn from you!

Do you mean "Blah" as in "not exciting"?  Or "Blah" as in "I hate frames"?  Or "Blah" as in "Frames are old technology and I want to use only the latest, leading edge stuff"?

TYIA for the education....
0
 

Expert Comment

by:jgeoff
ID: 6236375

Those who "hate" frames are often those who don't know how to use them properly :D

~JG

0
 
LVL 19

Expert Comment

by:webwoman
ID: 6236378
Probably BLAH as in frames tend to be a maintenance nightmare, search engines get confused with them, and you can't bookmark them directly.

I use them sometimes, but very rarely anymore. There are better ways (like SSI) to have standardized navigation.
0
 
LVL 18

Expert Comment

by:bruno
ID: 6238345
*points*  yes...what she said.

Frames used to be a great resource to keep navigation handy, and especially if you had navigation that was on ever page, that allowed you to maintain only ONE page of code, instead of hard coding it onto every page.  

There is not much that "I" personally would ever want to do with frames that I could not find a way to do with SSI.  The only good thing I see left is the ability to keep certain content viewable at all times, ie: navigation, header, footer.  NOT ALL AT ONCE, of course.

But as webwoman pointed out, it's a lot harder for search engines to index framed pages, a lot more difficult for users to bookmark pages within a frame set.  When I need to bookmark a page within a frameset, I generally bookmark JUST the individual page, which leaves me with no navigation when I return to it.  

Granted a lot of it has to do with the coder as JG pointed.  Somepeople can maked framed pages so seamless you would never even know you are in a frameset.  GREAT!  But frames are very easy to abuse.  And when certain things are TOO easy to abuse, other coders start to dislike it.

Anybody for a <BLINK> tag?

One of the most recent times I used frames was when we had to turn our extranet into a page that could be burned to a CD and distributed.  Well, you can't use SSI without a server, so we took our menu and header and put them into a frameset.  Not the prettiest way to do it, but one hell of a lot easier than going and hardcoding them onto every page.


BRUNO
0
 
LVL 1

Expert Comment

by:Ernest022699
ID: 6239045
brunobear: First, jgeoff is right, I'm afraid.

Second, because of the possibility of users with epilepsy (or other seizure-type disorders) Pages should never be made to have blinking anything or straight pulsing audio (e.g., a beat-beat-beat of 1K Hz).  The W3C recommends against it.  A <blink> tag would be just plain dangerous.  You may recall a scene in "The Andromeda Strain" where a flashing "No Growth" message causes a scientist to have a seizure.  That part was not fiction; it does happen.

webwoman: Sorry; I don't buy it.  I have sucessfully bookmarked many sites which are frames-based, as have other people.  The <meta> tags and hidden text have brought me (and countless other users) to frames-based sites.

All: People tend to want to use the latest and flashiest tools and techniques, whether or not there are older and simpler ways of accomplishing the same things.  It is human nature.  That's one reason why everyone from car makers to fashion designers constantly bombard us with the "New & Improved!" messages.

I'm not advocating going back to the typewriter or a burnt stick.  Nor a graphics-free Web.  I'm just suggesting that frames navigation, though not bleeding edge, has been proven to work well.
0
 
LVL 18

Expert Comment

by:bruno
ID: 6239254
so you are saying i shouldn't do this on my pages?


<script>
function colors()
     {
     x = Math.round(Math.random() * 5); // random number 0 to 5
     if (x==1) document.bgColor='red';
     if (x==2) document.bgColor='blue';
     if (x==3) document.bgColor='green';
     if (x==4) document.bgColor='yellow';
     if (x==5) document.bgColor='purple';
     id=setTimeout('colors()',100);
     }
     colors()
</script>


BRUNO
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 6256002
Thanks!  Sorry it took so long to give the points. Been a bit overwhelmed!

Rowby
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Javascript_Set_dropdown_value 7 40
Html CheckBox obtain Its Value 5 28
multiple selects 23 49
REST endpoint query with a parameter 1 18
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

820 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question