Class specific navigation code

[sugna]

Not sure if this is the best place to put this

I needed the navigation template to print out the page alias so I could style each li separately. After help from a friend and the forum here is what we came up with and it works perfectly.

Here is the site I'm working on:
http://site.pbats.com

Base code taken from minimal_menu.tpl

Create a new database Menu Template layout>Menu Manager "Add Template" paste code below


{if $count > 0}

{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="

  " times=$node->depth-$node->prevdepth}
  {elseif $node->depth prevdepth}
  {repeat string="
 

" times=$node->prevdepth-$node->depth}

{elseif $node->index > 0}

{/if}{if $node->current == true}
url}" class="{$node->alias}" {if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} {elseif $node->parent == true && $node->depth == 1}
url}" class="{$node->alias}" {if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} {elseif $node->type == 'sectionheader'}
{$node->menutext}{elseif $node->type == 'separator'}

 
  {else}
url}" class="{$node->alias}" {if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} {/if}{/foreach}{repeat string="

" times=$node->depth-1}


{/if}


The page template gets this


{cms_module module='menumanager' template='primary_navigation'}




Style Sheet code



/* --------- Primary Navigation --------- */

#primaryNavigation {
width:820px;
padding:0;
clear: both;
float: left;
background-color: #333333;
background-repeat: repeat-x;
background-position: left bottom;
position: relative;
}
#primaryNavigation ul {
list-style:none;
margin:0;
padding:0;
}
#primaryNavigation li {
float:left;
list-style:none;
margin-left:0px;
margin-top: 0;
margin-right: 0px;
margin-bottom: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
}

#primaryNavigation a {
padding-top: 5px !important;
padding-right: 0;
padding-bottom: 5px !important;
padding-left: 0;
color: #FFFFFF;

}

#primaryNavigation a.major-league-athletic-trainers {
display:block;
text-decoration:none;
line-height:21px;
width:200px;
text-align:center;
margin-top: 0;
margin-right: 1px;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
}
#primaryNavigation a.education-portal {
display:block;
text-decoration:none;
line-height:21px;
width:125px;
text-align:center;
margin:0 1px 0 0;
padding:0;

}
#primaryNavigation a.jobs {
display:block;
text-decoration:none;
line-height:21px;
width:100px;
text-align:center;
margin:0 1px 0 0;
padding:0;

}
#primaryNavigation a.news-center {
display:block;
text-decoration:none;
line-height:21px;
width:113px;
text-align:center;
margin:0 1px 0 0;
padding:0;

}
#primaryNavigation a.store {
display:block;
text-decoration:none;
line-height:21px;
width:85px;
text-align:center;
margin:0 1px 0 0;
padding:0;

}
#primaryNavigation a.blogs {
display:block;
text-decoration:none;
line-height:21px;
width:90px;
text-align:center;
margin:0 1px 0 0;
padding:0;

}
#primaryNavigation a.forums {
display:block;
text-decoration:none;
line-height:21px;
width:101px;
text-align:center;
padding:0;
margin-top: 0;
margin-right: 0px;
margin-bottom: 0;
margin-left: 0;

}
#primaryNavigation a:hover {
background-color: #CC0001;

}


of course style and name to fit your scenario

Shane