So, I'm playing around with the jquery Superfish menu, as tutorialized here:
http://users.tpg.com.au/j_birch/plugins/superfish/#getting-started
I'm just wondering how to structure the Wayfinder code to make this thing run, specifially the menuRows and menuContainer tpls.
The provided hard coded menus provided by that web site looks like this:
<ul class="sf-menu">
<li class="current">
<a href="#a">menu item</a>
<ul>
<li>
<a href="#aa">menu item that is quite long</a>
</li>
<li class="current">
<a href="#ab">menu item</a>
<ul>
<li class="current"><a href="#">menu item</a></li>
<li><a href="#aba">menu item</a></li>
<li><a href="#abb">menu item</a></li>
<li><a href="#abc">menu item</a></li>
<li><a href="#abd">menu item</a></li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li>
<a href="#">menu item</a>
<ul>
<li><a href="#">short</a></li>
<li><a href="#">short</a></li>
<li><a href="#">short</a></li>
<li><a href="#">short</a></li>
<li><a href="#">short</a></li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">menu item</a>
</li>
</ul>
I assume I need to structure the menuRows and menuContainer tpls to have Wayfinder deal with the initial <ul class="sf-menu"> and <li class="current"> parts of the structure, right? How, exactly should I write it, and within which tpl? As you will notice in the above code, there are other ul's and li's without classes in them. I guess I'm confused as to how to get Wayfinder to recognize which ul's and li's receive classes and which do not, all at the correct levels.
Right now, the contents of my menuContainer is:
<ul[[+wf.classes]]>[[+wf.wrapper]]</ul>
...and the contents of my menuRows is:
<li [[+wf.id]] [[+wf.classes]] > <a href="[[+wf.link]]" title="[[+wf.title}]" [[+wf.attributes}]>[[+wf.linktext]]</a> [[+wf.wrapper]]</li>
And, how to then structure the Wayfinder call? I assume it's going to be something like this:
[[!Wayfinder? &startId=`0` &outerTpl=`menuContainer` &innerRowTpl =`menuRows`]]
I've been trying to work from my copy of 'The Almost Complete Guide to Constructing Menus in MODx Using Wayfinder' pdf by Kongondo, but for whatever the reason, I cannot get it. I need this knowledge dumbed down a bit more.
Thank you in advance.
Running Revo 2.2.2 and I'm confident that the above tags have been converted to Revo from the pdf's Evo origination.
[ed. note: waizen last edited this post 14 years ago.]
