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.

Template Questions /

How to build a navigation with different colors


Reply


5 Posts   728 Views

Avatar
TomMiller

Community Member, 26 Posts

14 September 2011 at 12:54am

Hi all,
i am trying to build a navigation which is supposed to have a different color from a certain point on. I'd like to use ul and ol in my css. SS's output from the menu control should look like this:

<div id="subnav">
<ul>
<li><a class="current" href="content1.htm" title="title1">Title1</a></li>
<li><a href="content2.htm" title="title2">Title2</a></li>
<li><a href="content3.htm" title="title3">Title3</a></li>
<li><a href="content4.htm" title="title4">Title4</a></li>
</ul>
<ol>
<li><a href="content5.htm" title="title5">Title5</a></li>
<li><a href="content6.htm" title="title6">Title6</a></li>
<li><a href="content7.htm" title="title7">Title7</a></li>
</ol>
</div>

All pages content1 - content7 must be on the same level in the sitetree.
Can anybody please lead me to the smartest way to do this?

Thanks,
Tom

Avatar
x75

Community Member, 42 Posts

14 September 2011 at 1:06am

Hi,

if you allways want to do that after the 4th element and you know there are at least 5 elements you could simply use $Pos:

<div id="subnav">
<ul>
<% control Menu(1) %>
<% if Pos = 5 %>
</ul><ol>
<% end_if %>
<li><a class="$LinkOrCurrent" href="$Link" title="$Title.XML">$MenuTitle</a></li>
<% end_control %>
</ol>
</div>

Avatar
TomMiller

Community Member, 26 Posts

14 September 2011 at 6:31am

Thanks for your help! Unfortunately this is not an option because of flexibilty requirements. Can i just use another class for the pagetype and a syntax like <% if class=foo %> somehow?

Avatar
Ryan M.

Community Member, 309 Posts

14 September 2011 at 7:52am

Yes, you can do that with page class names.

<% if ClassName = YourClassName %>
do something
<% end_if %>

Avatar
TomMiller

Community Member, 26 Posts

15 September 2011 at 3:19am

Thanks again! I combined both answers and it works perfect.