Hi Josh,
The first thing you should do is downloading Wayfinder documentation. It’s available as a zip file from the Wiki.
It will help you a lot that a Wayfinder menu uses a system of boxes.
In general, the boxes are of the <ul>...</ul> type with <li>...</li> elements for each item.
Of course <ul>...</ul> boxes can be put inside <li> elements.
This way, you create the 2nd, 3rd, 4th level of your menus. No limit !
(But your CSS stylesheet for the menu can become quite complex !)
The model for the most outer box is defined in the chunk pointed by the outerTpl parameter.
Other inner boxes are described by innerTpl. (Wayfinder documentation explains this better.
What you must understand is that there are default chunks (with placeholders) that Wayfinder uses for its default output. What you can do is overwrite the default behavior by setting your own chunks.
What I advise you to do is using &configTpl. This way, you specify all your menu settings in a configuration file.
This is a lot easier to read than having to open and edit several chunks in MODx backend.
Normally, you put all the graphical settings in a CSS stylesheet. Call it with &cssTpl.
In the CSS sheet, define the appearance of the menu entries depending on how deep there are in the hierarchy.
A major difficulty is to find the way to make the CSS styling compatible with all browsers.
For example, on
http://www.cssplay.co.uk/ are many beautiful menu examples, but I observed the stylesheets were different if I used MSIE or Firefox.
It took me a while to master Wayfinder, so be patient.
I can provide some consulting if you don’t have time enough.
With Wayfinder, you can really do all what you want : drop menus, accordion menus, tree menus, a.s.o.
Have fun !
