I’m going round in circles with my 2nd Wayfinder navigation and I’m hoping someone may be able to save my sanity.
I have a straightforward main navigation: Home, Products, About etc
As a subnavigation from the Products menu, I have a side navigation which is constant on every internal page of the site. I have managed to call up this side nav, but I simply can’t find a way to style it. I have read lots of the Wayfinder documentation and have tried to follow Kongondo’s example from his amazing Wayfinder tome, but my menu has absolutely no reaction to the styling! It’s driving me nuts!
This is my original code (I know, I should have kept the CSS more straightforward - hindsight is a wonderful thing):
<!-- Inner Navigation -->
<div class="inNav">
<div class="navTop"><!-- --></div>
<div class="navMid">
<ul id="innerNav">
<li><a href="#" class="rugs selected"></a></li>
<li><a href="#" class="bits"></a></li>
<li class="last"><a href="#" class="feed"></a></li>
</ul>
</div>
<div class="navBot"><!-- --></div>
</div>
<!-- End Inner Navigation -->
At this stage, I’m just trying to style the ’innerNav’ id - I haven’t even got as far as thinking of styling the individual <li>s as although I’m sure it’s possible, I’m not sure that I’m up to it!
This is the chunk I have created and I have called it ’sideNav’:
<ul[+wf.classes+]>[+wf.wrapper+]</ul>
And this is what I have included in my template.
<!-- Inner Navigation -->
<div class="inNav">
<div class="navTop"><!-- --></div>
<div class="navMid">
[[Wayfinder? &startId=`2` &level=`2` &outerTpl=`sideNav` &outerClass=`innerNav`]]
</div>
<div class="navBot"><!-- --></div>
</div>
<!-- End Inner Navigation -->
It works in theory, but it’s just not calling up any of the ul styling from the ’innerNav’.
Can anyone tell me where I may be going wrong?
Thank you in advance.
Vicky