Add aria-labels to Wayfinder Nav

Hi all,

A banking client needs ADA compliance updates and one area is aria labeling of links for better descriptive information. I tried to add aria-label="" into the link attributes of their MODX resources but they don't seem to get picked up.

Is there a proven method to do this in MODX? Does Wayfinder have a way to insert aria labeling into the nav it generates?

Their issue is primarily short link titles for different sections of the site that are either redundant or not fully descriptive, ie. the landing page for each section is "Overview" which causes erros in reporting.

I appreciate an feedback from the group.

Thank you,

Mike

Wayfinder does need a little help to do all the things it can do. Mainly, your tpl chunks for the menus will have your markup with the placeholders for the kinds of things you want to do with the menu links. Basic Wayfinder actually does not generate anything more than the basic HTML of an unordered list. All your markup beyond that is in your rowTpl, innerTpl, and outerTpl chunks (the basic 3 chunks needed for menus)

What is the content of your Wayfinder menu tpl chunks?

What is the the content of your Wayfinder call?

You can use placeholders for the introtext (summary) and description fields from the resources for better descriptive text and add something like aria-label="[[+longtitle]]" to the tpl markup. Bear in mind though that your resource's fields will need to be filled in. If a bunch of pages were duplicated and every one left with the word "overview" in whatever field is outputting into the menus, all that will have to be fixed at the resource level.

Wayfinder docs are here: https://docs.modx.com/extras/evo/wayfinder

Thank you for the reply. That is exactly what I was looking for. These sites were developed by an agency for the client but a change in that relationship has my company now managing the sites and we've never used MODX before this.

Thank you again for the great information!

Mike