Custom Last Row

Hello,

I’m trying to recreate this menu structure with wayfinder, but can’t figure out how to get the last item to show up correctly.



I know I can use rowTpl to get line 1-4 working correctly, but line 5 (last item) has me stumped. Can this be done?

Thanks
AMDbuilder

Wayfinder sets a classname for the last item of every group. You can style these like ul li.last, ul ul li.last, etc to get the last row in each group. Control the classname with &last=`whatever`.

I think the problem is that the last menu item does not have the trailing <li>|</li>. I am guessing that this is a horizontal menu and the <li>|</li> are delimiters. You could either use css and set a border-right or use a background image to recreate this rather than using the pipe. Or, if this is a single level menu just use Ditto which has a tplLast chunk where you could remove the pipe for the last row.

Hello,

Thanks for the replies, I kinda figured what I wanted to do couldn’t be done with wayfinder, but you never know. I will try switching over to CSS to recreate the affect.

Thanks
AMDbuilder

Just trying to do the same sort of thing, after reading this post it made me think you could you place the | within a span and then in the CSS make the span display none.


So for &rowTpl chunk use:

<li[+wf.id+][+wf.classes+]><a href="[+wf.link+]" title="[+wf.title+]" [+wf.attributes+]>[+wf.linktext+]</a>[+wf.wrapper+]<span>&nbsp;|&nbsp;</span></li>


The html output is:

<ul>
<li class="active">Menu 1<span>|</span></li>
<li>Menu 1<span>|</span></li>
<li class="last">Menu 1<span>|</span></li>
</ul>


And the CSS would be

li.last span{display:none}

Ben

I don’t recall where I wanted to use this now, but it’s nice to have the solution!

Thanks
AMDbuilder