Page 1 of 1
Menu styling? Easy answer for s1 who knows what he does!
Posted: Tue Dec 12, 2006 4:22 pm
by rtkd
Hi,
i'm trying to restyle the menu.
It almost works like a charm, but the code it creates is missing just one div.
I've tried a lot but somehow i just dont get it...
here is the code it produces
Code: Select all
<div>
<div class="parent">
<a href="">1</a>
<div>
<div class="current"><a href="">1.1</a></div>
<div class="else"><a href="">1.2</a></div>
<div class="else"><a href="">1.3</a></div>
<div class="else"><a href="">1.4</a></div>
</div>
</div>
<div class="link"><a href="">2</a></div>
<div class="link"><a href="">3</a></div>
<div class="link"><a href="">4</a></div>
</div>
and this is how i should look
Code: Select all
<div>
<div class="parent"><a href="">1</a></div>
<div>
<div class="current"><a href="">1.1</a></div>
<div class="else"><a href="">1.2</a></div>
<div class="else"><a href="">1.3</a></div>
<div class="else"><a href="">1.4</a></div>
</div>
<div class="link"><a href="">2</a></div>
<div class="link"><a href="">3</a></div>
<div class="link"><a href="">4</a></div>
</div>
and here the tmpl. code
Code: Select all
{if $count > 0}
<div>
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<div>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</div></div>" times=$node->prevdepth-$node->depth}
</div>
{elseif $node->index > 0}
</div>
{/if}
{if $node->parent == true or ($node->current == true and $node->haschildren == true)}
<div class="parent"><div><a
{elseif $node->current == true}
<div class="current"><a
{elseif $node->type == 'link'}
<div class="link"><a
{elseif $node->haschildren == true}
<div class="hasChildren"><a
{else}
<div class="else"><a
{/if}
{if $node->type != 'separator'}
href="{$node->url}">{$node->menutext}
</a>
{/if}
{/foreach}
{repeat string="</div></div>" times=$node->depth-1}
</div>
</div>
{/if}
thank u for help, rtkd!
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Tue Dec 12, 2006 11:51 pm
by Dr.CSS
Try adding one at the end here, you may have to take out one of the others... I also add 1, 2, 3, in the menu template to see where it may need something... They may not show on the page so look in the source...
{if $node->type != 'separator'}
href="{$node->url}">{$node->menutext}
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Wed Dec 13, 2006 10:43 am
by rtkd
hi,
thank u for ur quick answer, but i somehow still don't get it...
i think i just don't understand the syntax of the .tpl file.
i need a div around the parent link of of the active section, i commented in the code.
Code: Select all
<div>
<div class="parent">
/*
@ I need DIV class="link" around the "Parent Link"
@ so i can give class="link" a bg-pic with css
*/
<div class="link"><a href="">1</a></div>
/*
@
*/
<div>
<div class="current"><a href="">1.1</a></div>
<div class="else"><a href="">1.2</a></div>
<div class="else"><a href="">1.3</a></div>
<div class="else"><a href="">1.4</a></div>
</div>
</div>
<div class="link"><a href="">2</a></div>
<div class="link"><a href="">3</a></div>
<div class="link"><a href="">4</a></div>
</div>
thank you for ur help, i really appreciate it!
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Wed Dec 13, 2006 1:10 pm
by Dr.CSS
Try this... forgot to take out the numbers, that's how I found the offending div calls... just delete them
{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="8" times=$node->prevdepth-$node->depth}
{elseif $node->index > 0}
6
{/if}
{if $node->parent == true or ($node->current == true and $node->haschildren == true)}
current == true}
type == 'link'}
haschildren == true}
type != 'separator'}
href="{$node->url}">{$node->menutext}
{/if}
{/foreach}
{repeat string="3" times=$node->depth-1}
{/if}
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Wed Dec 13, 2006 1:34 pm
by rtkd
hi mark,
its just missing one closing div somewhere, i hope i'll find it myself.
otherwise works fine.
thank you a million times! rtkd
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Wed Dec 13, 2006 5:14 pm
by rtkd
nope. cant find it myself
if i put another into {repeat string="3" times=$node->depth-1}
it works fine untill i click the last element in the navigation, then again tidy tells me its missing a closing div.
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Thu Dec 14, 2006 5:06 am
by Dr.CSS
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Thu Dec 14, 2006 1:02 pm
by rtkd
not yet. i'lll put it online first thing tomorrow!
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Fri Dec 15, 2006 3:30 pm
by rtkd
http://web35.clickpress.info/
pls, don't be mad at me for using tables in the template
but that layout was just too difficult to realize with divs.
i took out the whole nav, to see if the missing div still occures, and it didnt,
so i figured it must be in the nav menu code
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Fri Dec 15, 2006 3:44 pm
by Dr.CSS
Why are you using div on the menu I thought you were doing something along the lines of this...
http://www.multiintech.com/cmsms2/ or...
http://www.multiintech.com/cmsms2/index.php/golf.html
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Sat Dec 16, 2006 8:57 am
by rtkd
oh, i just took the cssmenu and stripped it of everything i thought i would not need.
as said im not really familiar with the template language.
Re: Menu styling? Easy answer for s1 who knows what he does!
Posted: Sat Dec 16, 2006 12:59 pm
by Dr.CSS
Start with the default cssmenu template and copy the Vert. Nav CSS Menu style sheet, go to Layout > Style Sheets to the right is an icon, looks like 2 sheets of paper, click, rename, submit, use this with your template...
If you use Firefox with the Web Developer toolbar you can edit the CSS in real time, not the real one it just works on the side so you can play/tweak till you like it, then when you get it right copy the part you changed and paste it into the real CSS...
You will need the default Tools CSS to get rid of the numbers in the menu...