Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Aria-Label for Primary Nav with Sub-Menu

  • Hi,

    We’re working to get our sites in compliance with WCAG by Apr 2026 as are many other local US government agencies. We use Siteimprove to audit our sites. One item it’s flagging is the use of an aria-label attribute on our primary nav links with sub-menus. It detects the label value isn’t the same as the link text. For example the menu item ‘My Account’ on one of our sites is using the aria-label “open submenu”. This is confusing for screenreaders. Instead, the recommendation is to not override the visible text with an aria-lable. The result would be:

    <a
    href=”#”
    role=”button”
    aria-haspopup=”true”
    aria-expanded=”false”
    aria-controls=”menu-item-86938-sub-menu”
    >
    My Account

    This would result in:

    Screen reader output (collapsed): “My Account, button, collapsed, has popup”

    Expanded: “My Account, button, expanded”

    Thanks for taking a look into this!

  • Hi there,

    Can you try setting the Navigation Dropdown to Click – arrow at customizer > layout > primary navigation?

    Let me know if this helps!

  • Hi Ying – I think turning that option results in less effective HTML. Added a link to a ChatGPT session that might be helpful in the Private Information section.

  • Hi there,

    Can you try adding this snippet:

    add_filter( 'nav_menu_link_attributes', 'fix_submenu_aria_label', 20, 4 );
      function fix_submenu_aria_label( $atts, $item, $args, $depth ) {
          // Only target main navigation with click dropdown type
          if ( isset( $args->container_class ) && 'main-nav' === $args->container_class ) {
              if ( in_array( 'menu-item-has-children', $item->classes, true ) ) {
                  // Remove the aria-label so screen readers use the visible link text
                  unset( $atts['aria-label'] );
              }
          }
          return $atts;
      }

    Adding PHP: https://docs.generatepress.com/article/adding-php/

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.