Help with "one stop" navigation editing...

**euphoriastudio** · 01-05-2008, 09:37 PM

So I'm building this site for a company and I'm having some issues. I would like to use SSI to have just one place that they can go to change the menu for the entire site, but I want to use "shrink-wrapping" tabs. My issue is that i set up the li id so the active page would be highlighted, but I'm not sure how to customize the highlighted tab with the correct page for every page. Does anyone have any ideas?

css:

Code:

    #tabs {
      float:left;
      width:100%;
      background:transparent;
      font-size:93%;
      line-height:normal;
	  border-bottom:0px solid #FFFFFF;
      }
    #tabs ul {
	  margin:0;
	  padding:10px 10px 0 80px;
	  list-style:none;
      }
    #tabs li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabs a {
      float:left;
      background:url("http://euphoriastudio.freehostia.com/tableft.png") no-repeat left top;
      margin:0;
      padding:0 0 0 13px;
      text-decoration:none;
      }
    #tabs a span {
      float:left;
      display:block;
      background:url("http://euphoriastudio.freehostia.com/tabright.png") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#FFFFFF;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabs a span {float:none;}
    /* End IE5-Mac hack */
    #tabs a:hover {
      color:#FFFFFF;
      background-position:0% -42px;
      }
    #tabs a:hover span {
      color:#FFFFFF;
      background-position:100% -42px;
      }
li#current a 
 {
      color:#000000;
      background-position:0% -84px;
}
li#current a span 
 {
      color:#000000;
      background-position:100% -84px;
}

Nav:

Code:

<body>
<div id="Layer1" style="z-index: 1; left: 10px; height: 140px; position: absolute; top: 0px">
<img height="140" src="http://euphoriastudio.freehostia.com/header1.png" width="800" /> 
</div>
<div id="tabs" style="z-index: 5; left: 0px; position: absolute; top: 109px; height: 31px;">
  <ul>
    <li><a href="http://euphoriastudio.freehostia.com/tmst.shtml" title="Home"><span>Home</span></a></li>
    <li><a href="http://euphoriastudio.freehostia.com/test.shtml" title="FAQ"><span>FAQ</span></a></li>
    <li><a href="http://euphoriastudio.freehostia.com/test.shtml" title="Analysis"><span>Analysis</span></a></li>
    <li><a href="http://euphoriastudio.freehostia.com/test.shtml" title="Testimonials"><span>Testimonials</span></a></li>
    <li><a href="http://euphoriastudio.freehostia.com/test.shtml" title="Contact Us"><span>Contact Us</span></a></li>
  </ul>
</div>

**euphoriastudio** · 01-06-2008, 03:56 AM

Ok more info! I found a more specific way to say what I need! I'm basically wanting to use server side scripting to identify which tab corresponds to the current page. But I also want to use one document for the navigation links so I only have to update one page to add/remove links. Anyone? Please...

**BLiZZaRD** · 01-06-2008, 09:36 AM

You will want to use PHP. Put all of this (not the CSS) in a php page, no header, no title, just that code. Name it something like menu.php Then include it on every page you want the menu to appear using:

PHP Code:


<?php include 'menu.php' ?>

Now your trick is to make the page report to PHP and tell it which page has been chosen. That will then tell the menu to show which tab is "active"

For that, post the question in the PHP forum, so we don't confuse people posting in here.

**euphoriastudio** · 01-06-2008, 06:37 PM

ok just to make sure I understand you right, the navigation code I posted needs to be in a php page. correct? do i have to rename all my pages with ".php" if I use the menu code or will it work with a ".html" or ".shtml" extension?

Thank you so much for taking the time to help. I've been racking my brain!

**Medyman** · 01-06-2008, 07:51 PM

Originally Posted by euphoriastudio

ok just to make sure I understand you right, the navigation code I posted needs to be in a php page. correct? do i have to rename all my pages with ".php" if I use the menu code or will it work with a ".html" or ".shtml" extension?

Thank you so much for taking the time to help. I've been racking my brain!

To be able to parse PHP coding, you'll need to rename the files to .php.

**euphoriastudio** · 01-06-2008, 08:07 PM

thanks! man i wish i would have joined this forum months ago! everyone is so helpful and nice

**BLiZZaRD** · 01-07-2008, 12:05 AM

Originally Posted by Medyman

To be able to parse PHP coding, you'll need to rename the files to .php.

If you don't want to use php extension on your pages you can use .htaccess to force .htm and .html to parse php:

Create a .htaccess file with these two lines in it:

Code:

AddType application/x-httpd-php .html .htm
AddHandler application/x-httpd-php .html .php .htm

and upload it either just inside or just outside your root folder. this folder is called different things on various servers, public_html is the most common, followed by htdocs and root.

Thread: Help with "one stop" navigation editing...

Thread Tools

Search Thread

Help with "one stop" navigation editing...

Bookmarks

Bookmarks

Posting Permissions