Page 1 of 1
[SOLVED]Problem with alternating row colour in navigation
Posted: Fri Feb 15, 2008 11:04 am
by ballantyne
I am using the smarty cycle tag to make alternating row colours in my vertical navigation. When I'm browsing the parent page, the alternating colours start at the first child page. When I browse a child page, the parent page now becomes the first row and takes the first colour. So the bottom row is either colour 1 or 2 depending on which page I'm browsing. This looks a bit lame. How can I fix it, please?
The css looks like this
div#menu_vert li.odd {
background:#99CCFF;
}
div#menu_vert li.even {
background:#FFFFFF;
}
...snip
div#menu_vert li a.activeparent {
background: url(images/cms/arrow-down.gif) no-repeat 0.4em center;
background-color: #99CCFF;
color: #FFFFFF;
font-weight:bold;
font-size:110%;
}
div#menu_vert ul ul li a.activeparent {
background-position: 1.5em center;
background-color: transparent;
color: #18507C;
}
..snip
and the .tpl is like this
{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}
{elseif $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}
{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}
...snip
Jonathan
Re: Problem with alternating row colour in navigation
Posted: Thu Feb 21, 2008 12:24 am
by nivekiam
Don't know what to say, it works fine for me. Can you post a link to the page you are having a problem with?
Re: Problem with alternating row colour in navigation
Posted: Fri Feb 22, 2008 2:34 am
by ballantyne
http://rbo.level-five.com - try clicking on a child page and watch how the nav colours change
Re: Problem with alternating row colour in navigation
Posted: Fri Feb 22, 2008 3:31 am
by nivekiam
Oh, I see. Well it's doing exactly what you tell it
RBO Home is always the activeparent
Example, Tuggerah is the "currentpage"
It cycles through doing even (erina-fair), odd (mann-st-gosford), even (lakehaven), odd (mthutton). Now the cycle skips because of the current page Tuggerah, now back to the cycle, even (charlestown), odd, etc
It doesn't count the current page as part of the cycle, you need to change your logic in your menu template. I can help out here a little bit as I've dissected the menu to see what it's doing on my own site, but I don't have the time tonight.
Perhaps this untested change:
Your original code:
{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}
{elseif $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}
{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}
My untested change, yanking out the setting for Current Page:
{if $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}
{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}
or maybe this, equally untested code
{if $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}
{else}
current == true} " currentpage"{/if}[/b][/color]">url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}
Gotta go for now, so much to do, so little time.
Re: Problem with alternating row colour in navigation
Posted: Tue Feb 26, 2008 12:15 am
by ballantyne
Thanks for your help - you've certainly pointed me at the right place to solve this problem. The solution in words is simple: there is a third class of line called "currentpage" that is not in the odd,even cycle, so all I need to do is make the cycle function's counter advance by one when the currentpage condition is true, as it does in the else condition. There is a parameter for this in the smarty tag, but I don't know how to code this into this particular template. I can write procedural php, so I guess I could write my own tag? Whadyreckin?
Jonathan
Re: Problem with alternating row colour in navigation
Posted: Thu Feb 28, 2008 1:50 am
by ballantyne
In the navigation tpl the cycle tag is used to generate the line class, like so (see red bit):
{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}
{elseif $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}
{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}
Is it possible to simply call the cycle tag in the currentpage condition, so that the cycle counter increments in that condition as well, without using it to generate the line class, like so:
{cycle values="even,odd"}Current page is {$node->hierarchy}: {$node->menutext}
?I guess my question is really about the syntax of tags.
Jonathan
Re: Problem with alternating row colour in navigation
Posted: Thu Feb 28, 2008 3:38 am
by nivekiam
ok. I dug into it more. Looks like you are using the simple_navigation template as a basis.
Do this, similar to what I posted before, but tested. Add the code that
bolded in
red
{if $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}
{else}
current == true} currentpage{/if}[/b][/color]">url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}
{/if}
Now, you just need to define some CSS for the
currentpage class
Example:
Code: Select all
div#menu_vert li.currentpage a {color: red; font-size: 2em;}
This way you can define different looking text for the current page and the background still alternates. This is just one simple example. I think you can get really complex if you want.
You can make your smarty code more readable and eliminate white space in the generated HTML by using the {strip} tag. Lookup it's usage at
www.smarty.net
[SOLVED] Problem with alternating row colour in navigation
Posted: Mon Mar 03, 2008 2:32 am
by ballantyne
It actually turns out this is the solution in red:
{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}
{elseif $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}
{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}
{/if}
And I am afraid I have no idea why it works.
Jonathan