Wayfinder to display parent folder as a menu item, with link and same style ?

Hello,
I've been reading through webs, some older posts and try to figure this out but I can't make it work properly. I am a modx noob, btw and most of it is clear, by now, except this wayfinder issue.

I have this call: [[Wayfinder? &startId=`1` &level=`0` &displayStart=`true`]]

And it outputs this, in html:

<div id="wayfinderdiv">

<h2 class="first active">Home</h2>

<ul>
<li class="first active">
<a title="About" href="index.php?id=2">About Us</a>
</li>
<li>
<a title="Places" href="index.php?id=3">Our Locations</a>
</li>
<li>
<a title="Services" href="index.php?id=4">Our Services</a>
</li>
<li class="last">
<a title="News" href="index.php?id=5">News</a>
</li>
</ul>

</div>

As you can see, the Home page, which is the folder of the rest, is displayed as h2, without link or anything. I want it to be displayed exactly like the rest, same style. Can that be done ? I've been reading through tons of helps and tried to style it but can't figure it. Maybe is here, someone who can help. I styled the "wayfinderdiv" ul links in some way and the home folder, which is h2, should be an ul as well, I guess.

Setting &displayStart=`true` allows you to use the property &startItemTpl to define the output you want for the start document (here Home).
Since you don't have this property in your WF call, the default startItemTpl is used:
[[+wf.wrapper]] is the placeholder for the menu itself which is using the default outerTpl
To make the Home page a menu item like the others, you want this output:
One way to achieve this:
Change the outerTpl, omitting the leading ul-tag:

Chunk "outer_tpl":Put the starting tag <ul> into the startItemTpl instead, and change the h2 element into a li element, containig also the link to the Home page:

Chunk "start_item_tpl":
Now with the WF callyou should get the desired result.

BTW: You always should use `1` and `0` instead of `true` and `false`.

Edit: Corrected link syntax.

[ed. note: ottogal last edited this post 13 years, 3 months ago.]

Did you try setting the startId to 0?

What is the output if you change your wayfinder call to this?



If you use this as your wayfinder call you will get the results you want, no need to specify any tpls etc.

Good Luck. [ed. note: benmarte last edited this post 13 years, 3 months ago.]

Using &startId=`0` will generate a menu using all of the top-level resources, not just #1 and its children. The &dispayStart and &startItemTpl along with the manipulations of the tpls will do the job.

@ottogal

Man you are genius ! You should adopt a noob !
That fixed the thing properly, I will look around to understand what happened now, properly.
Now, for other noobs to understand, I will post the HTML output of the call you made and the chunks, above :

<div id="wayfinderdiv">

<ul class="first active"><li class="first active"><a href="index.php?id=1">
Home
</a></li><li class="first"><a title="About Us" href="index.php?id=2">
About Us
</a></li><li><a title="Our Locations" href="index.php?id=3">
Our Locations
</a></li><li><a title="Our Services" href="index.php?id=4">
Our Services
</a></li><li class="last"><a title="News" href="index.php?id=5">
News
</a></li></ul>

</div>

Now, I will have to work on SEO, as the links show php.

@benmarte

Your call, [[Wayfinder? &startId=`0`]], is the minimal wayfinder call and turns everything into a freak show. Will display everything, every ID, regardless of folders. I've tried those before, countless times. What ottogal^^ wrote, works just perfect. Thanks again !

For total noobs: If you want to have multiple calls (wayfinder menus) on other menu id's, then make changes in "start_item_tpl" above, in another chunk, accordingly and make the call for your id's.

I guess this should change to solved.

I guess this should change to solved.

Not yet...

Both the <li> elements for Home and About Us are assigned the class "first" - obviously since About Us is the first item in the list created by the [[+wf.wrapper]] placeholder.
(That would not harm in case you don't need a special CSS formatting for the first item.)

Another idea: If you want Home to line up with the other menu items, why you made it the parent of them? Just let all the main items be siblings of Home, and you won't have the problem at all.

How can you do that ?

I have a document tree, like in the attached image.
If I let them all in root and don't make folders how can I have them styled same and display exactly what needs to be up, up and down, down. I intend to have 2 menus, one above, with main buttons and a secondary for other stuff, like terms, privacy, etc, down.

Can that be done in other way ? Like simpler, logical in the wayfinder's logic ?

I just styled the li and ul tags of the parent call div.
[ed. note: modxvirtual last edited this post 13 years, 3 months ago.]

You should have 1, 2, 3, 4, 5, 6 all in the root. This will form the top-level menu.

Anything you don't want in the top level, like 6, check its "hide in menu" checkbox. I usually name such a folder "site tools", and have the items I want in the footer or aside menu, such as privacy, terms of service, site map, etc in that folder. Usually I don't even bother to use Wayfinder, I just hand-code that menu, as it doesn't change.

Well, when issue is about displaying the folders, same style as their children pages, not about hiding them from menu.
A folder, in back admin, is actually a page in the website, but it doesn't display correctly by default calls, you have to work around it. Hard coding menus I guess everyone wanting to use wayfinder, can do, but they won't update, when a non tech user will just create another content page in the website. So it's sort of useless. If I go for hard coding everything, i better quit using any framework then and start reinventing the wheel ...again. I tried that before, that's why I'm trying to use modx/wayfinder, now.