A difficult (at least for me) menus in Wayfinder

156 Posts

Roberto Reply #1, 17 years ago

Hi all.

I’ve got to make a menus for my site. This is the HTML:

<div class="table">
   <ul class="select">
      <li>
         <a href="#nogo">
            <b>First level page</b>
         </a>
         <div class="select_sub">
            <ul class="sub">
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
            </ul>
         </div>
      </li>
   </ul>
   <ul class="current">
      <li>
         <a href="#nogo">
            <b>First level ACTIVE page</b>
         </a>
         <div class="select_sub show">
            <ul class="sub">
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li class="sub_show">
                  <a href="#nogo">Second level ACTIVE page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
               <li>
                  <a href="#nogo">Second level page</a>
               </li>
            </ul>
         </div>
      </li>
   </ul>
</div>

Now, I have only one template for the first level pages, for the second level pages and for the nth-level pages, so I woul like to have only one call good for every template.

If I am on a first level page or on a second level page, it’s simple to get it but with 2 different calls.

The difficult (for me) comes when I am on a nth-level page (with n>=3).

The reason is this: how can I have 2 different "active" Tpl for Wayfinder? I mean, for the first level pages I would use activeParentRowTpl, but what about the 2nd level <li class="sub_show"></li> ?

How do you make this menu?

If something isn’t clear just ask me

Thanks in advance,

Roberto

1,390 Posts

kongondo Reply #2, 17 years ago

Hi,

Quick and untested to get you going:

[b]outerTpl[/b]

<div class="table"> <!-- This div can either be part of the site template or part of the outerTpl-->
[+wf.wrapper+]
</div>

rowTpl

<ul class="[+myULClass+]"> <!-- You could also use a document variable field like [+alias+] instead or an id if you want. In that case, use rowIdPrefix-->
<li>
<a [+wf.classes+] href="[+wf.link+]"> <!-- First Level Active page will be taken care of by Wayfinder -->
<b>[+wf.linktext+]</b> <!-- why not use span instead of b tags? and then style them with CSS -->
</a>
<div class="[+myDivClass+]"> <!-- for the class="select_sub" you could use a text TV or some other document variable, e.g. [+alias+]. I am using a TV here since the other div had a different class, i.e. class="select_sub_show" -->
[+wf.wrapper+]
</div>	
</li>
</ul>

innerTpl

<ul class="sub">
[+wf.wrapper+]
</ul>

innerRowTpl

<li>
<a [+wf.classes+] href="[+wf.link+]">[+wf.linktext+]</a>
</li><!-- Second level Active page - The active class can be set in WF call; i.e. &hereClass=`sub_show` -->

You could move the [wf.classes] that are within the <a> tags to the corresponding <li> tags if you prefer to style the <li> rather than the <a>

Hope this helps. Hopefully haven’t forgotten anything

cheers/k

Wayfinder Lessons: The (almost) Complete Guide to Creating Menus in MODx Using Wayfinder

156 Posts

Roberto Reply #3, 17 years ago

How can I get those placeholders?

[+myULclass+] for example?

Lol, how noob I am, today I have got into wayfinder core and hacked it to get the result...

Tomorrow I’ll test both the hacked wayfinder and your solution!

If my hack works, I’ll explain and post it

Cheers!

Roberto

1,390 Posts

kongondo Reply #4, 17 years ago

Quote from: Roberto at Sep 15, 2009, 01:47 PM

How can I get those placeholders?

[+myULclass+] for example?

That’s a TV. In WF, you don’t call TVs the normal way, e.g. [*myULclass*]. Instead you use the [+yourTVName+] format.

cheers/k

Wayfinder Lessons: The (almost) Complete Guide to Creating Menus in MODx Using Wayfinder

156 Posts

Roberto Reply #5, 17 years ago

So, here I am.

I didn’t try your solution, but I can tell that I can’t use &hereClass because it outputs the class all along the menu; this is going to break it.

It’s also a tricky solution for us because we already have a lot of TVs in our pages, so it’s better to not increase them

Here it is my solution, obtained by hacking the wayfinder.inc, adding a new Tpl.

I called this template &activeInnerRowTpl, because it is used in the same way as &activeParentRowTpl, but it applies on InnerRow and not on ParentRow laugh

Its priority is between &activeParentRowTpl and &categoryFoldersTpl. It is a very personal hack; I’ve got a 2 level horizontal menu, that doesn’t cover the entire site tree. When I’m on a descendant not displayed in this menu, I’ve got to highlight the 2nd level grandparent and the UltimateParent, but in 2 different ways. So, the 1st level is using &activeParentRowTpl and the 2nd level is using the &activeInnerRowTpl laugh

To get this you just have to add

elseif ($resource['level'] > 1 && $this->_templates['activeInnerRowTpl'] && ($resource['level'] <= $this->_config['level'] || $this->_config['level'] == 0) && $this->isHere($resource['id'])){
          	$usedTemplate = 'activeInnerRowTpl';
        }

in wayfinder.inc.php, around the 161th row, in the renderRow function.

Then you have to add

'activeInnerRowTpl' => isset($activeInnerRowTpl) ? $activeInnerRowTpl : '',

in the snippet that comes with MODx, in the $wf->_templates = array(); around the 91th row.

Cheers,

Roberto

1,390 Posts

kongondo Reply #6, 17 years ago

Nice one Roberto,

Hey, if this has uses, you could probably give Kyle a shout about this, as a feature request. Thx.

Glad you sorted it.

cheers/k

Wayfinder Lessons: The (almost) Complete Guide to Creating Menus in MODx Using Wayfinder