Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Customising the CMS /

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

Sub Level Menu Problem


Go to End
Reply


2 Posts   2140 Views

Avatar
rach999

Community Member, 4 Posts

9 January 2010 at 11:06pm

Hi All,

Having trouble with my code.

Here is my menu

<% if Menu(1) %>
<ul class="firstLevel">
<% control Menu(1) %>
<li><a href="$Link" title="$MenuTitle" class="$LinkingMode">$MenuTitle</a>

<% if LinkOrSection = section %>
<ul class="secondLevel">
<% control Children %>
<li class="$LinkingMode <% if FirstLast %>$FirstLast<% end_if %>">
<a href="$Link" title="$MenuTitle" class="$LinkingMode">$MenuTitle</a>
<% if LinkOrSection = section %>
<ul class="thirdLevel">
<% control Children %>
<li class="$LinkingMode <% if FirstLast %> $FirstLast<% end_if %>">
<a href="$Link" title="$MenuTitle" class="$LinkingMode">$MenuTitle</a>
</li>
<% end_control %>
</ul>

<% end_if %>

</li>
<% end_control %>
</ul>
<% end_if %>

</li>
<% end_control %>
</ul>
<% end_if %>

problem is first level all good, and second, but when i got the the third level it uses second level class not third.

heres my style

.firstLevel li {
float:left;
border-top:1px solid #70a2f9;
border-bottom:1px solid #70a2f9;
background-color:#488bf9;
}
.firstLevel li.current,
.firstLevel li.section {

background-color:#6da2f7;
}
.firstLevel li a {
display:block;
color:#ffffff;
width:180px;
font-weight:normal;
font-size:1.4em;
text-decoration:none;
padding:10px 10px 10px 10px;
background-color:#488bf9;
background-image: url(../images/navigation.png);
}
.firstLevel li a:hover {
color:#488bf9;
background-image: url(../images/navigation_hover.png);
}

.firstLevel li.current a,
.firstLevel li.section a {
color:#edecf7;
background-image: url(../images/navigation_curr.png);

}

.secondLevel li {
float:left;
background-color:#6da2f8;
border-bottom:1px solid #70a2f9;
border-top:1px solid #70a2f9;
}

.secondLevel li.current {
color:#e1e1d5;
background-image: url(../images/navigation_third.png);}

.secondLevel li.section {
color:#e1e1d5;
background-image: url(../images/navigation_third.png);}

.secondLevel li a {
display:block;
width:180px;
color:#fff;
font-weight:normal;
font-size:1.2em;
text-decoration:none;
padding:10px 10px 10px 10px;
background-image: url(../images/navigation_sec.png);
}
.secondLevel li a:hover {
color:#fff;
background-image: url(../images/navigation_sec_hover.png);
}

.secondLevel li.current a {
color:#e1e1d5;
background-image: url(../images/navigation_sec_curr.png);}

.secondLevel li.section a {
color:#e1e1d5;
background-image: url(../images/navigation_sec_curr.png);}

.thirdLevel li {
float:left;
background-image: url(../images/navigation_third.png);
border-bottom:1px solid #70a2f9;
border-top:1px solid #70a2f9;
}
.thirdLevel li.current,
.thirdLevel li.section {

background-image: url(../images/navigation_third.png);
}

.thirdLevel li a {
display:block;
width:100px;
color:#fff;
font-weight:normal;
font-size:1.1em;
text-decoration:none;
padding:10px 10px 10px 10px;
background-image: url(../images/navigation_third.png);
}
.thirdLevel li a:hover {
color:#fff;
background-image: url(../images/navigation_third.png);
}

.thirdLevel li.current a,
.thirdLevel li.section a {
color:#e1e1d5;
background-image: url(../images/navigation_third.png);}

any help would be greatly appreciated.

THANKS :)

Avatar
CodeGuerrilla

Community Member, 105 Posts

14 January 2010 at 7:33pm

Edited: 14/01/2010 7:34pm

You are inside Menu(1) control I don not believe you can control Children of Children, I would seperate the controls out or at least the 3rd level you could try something like (untested):

<% control Menu(1) %>

...

<% end_control %>


<% control Menu(2) %>

    ...

    <% control Children %>
        ...
    <% end_control %>

<% end_control %>

or

<% control Menu(1) %>

    ...

    <% control Children %>
        ...
    <% end_control %>

<% end_control %>

<% control Menu(3) %>

...

<% end_control %>

If that doesn't work then just control Menu(1) with the nested Children control and write a custom function in yopur controller to get the third level good luck!