I want to create a navigation using Wayfinder in this form:
<li class="active-class"><a>Option 1</a></li>
<li class="dropdown-li-class"><a class="dropdown-a-class">Option 3</a>
So I need to define three different classes within Wayfinder:
active-class on the currently viewed page
dropdown-li-class on the li-item containing the dropdown list
dropdown-a-class on the a-item within the li-item containing the dropdown list
I know I can define the
active-class with the
&hereClass-property and also the dropdown class via the
&parentClass. What I don’t know is how to set the
&parentClass individually for the
li and the
a tag. As far as I know I can only define where all classes go with
[[+wf.classes]]. Any ideas?
// the Wayfinder call (so far)
// the naviRow tpl (so far)
<a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.classes]]>[[+wf.linktext]]</a>
Try https://docs.modx.pro/en/components/pdotools/snippets/pdomenu. It’s faster and I think your situation is easier to accomplish.
To be fair, turns out in my case Wayfinder could’ve worked just as well, I was simply too focused on setting the classes seperately from the templates. The solution is to simply add the needed classes in the
&parentRowTpl (or now that I’m using pdoMenu in the
&tplParentRow) like this:
// for Wayfinder (&parentRowTpl)
<a href="[[+wf.link]]" [[+wf.attributes]] class="dropdown-a-class">[[+wf.linktext]]</a>
// for pdoMenu (&tplParentRow)
<a href="[[+link]]" [[+attributes]] class="dropdown-a-class">[[+menutitle]]</a>
I’ve never looked into pdoTools before, so very thankful for that hint @ilja-web! Will use that alot more in the future.
So, to be clear, use no parentClass at all, just define the area of parents in tplParentsRow?
In my case yes, you can of course still define the parentClass and call it with the respective
This topic was automatically closed 2 days after discussion ended and a solution was marked. New replies are no longer allowed. You can open a new topic by clicking the link icon below the original post or solution and selecting “+ New Topic”.