Wayfinder: how to control the select state of a parent of a page

Hi there,

Say I have a site with the following hierarchy:

+Parent A (container)
- Child A1
- Child A2
- Child A3
+Parent B (container)
- Child B1
- Child B2
- Child B3
+Parent C (container)
-Child C1
-Child C2

Let’s say in my footer, I use Wayfinder to always display all the Parents (no children submenus):

Parent A | Parent B | Parent C

When a user goes to one of the child pages, I am hoping to be able to highlight its parent, eg, user selects Child B1, the footer would look like:

Parent A | Parent B | Parent C

Is there a Wayfinder param and here template I can use?

thanks!
Steve

I think there is something like an "here class" /selected. Look at some exemple and the css you will find .

Hope it help.

Hi alchime,

thanks for speedy reply. I tried &hereClass and &parentClass after your suggestion, but it doesn’t appear to work, eg, in the snippet call:

[!Wayfinder? ... &hereClass=`selected` &parentClass=`selected`!]

and in the stylesheet:

.selected { font-weight: bold; }

but no luck ... when I’m on a child page, the parent folder link’s style in the footer doesn’t change. Any other suggestions or am I using the wrong syntax?

thanks,
Steve

Should do it.

thanks for everyone’s feedback, but I still can’t get this hereClass param to work -- though it’s description seems to be exactly what I’m looking for. Is Wayfinder supposed to add the value of hereClass param as a class attribute to the <a> tag (I’m not seeing any changes in the HTML)?

I’m including the Wayfinder call and output chunks/templates below with the hopes that someone can see what I’m not doing right.

Wayfinder call:


footer_menu_outer_tpl:


footer_menu_row_tpl:


stylesheet (I included the ’activeLink’ class in the site’s main style sheet rather than specifying a cssTpl param):

You are missing the class placeholder in your rowTpl so WF has no place to output the class information. Add [+wf.classes+] to the TPL where the class should show:

Thanks dev_cw (and all contributors). That was the ticket!