steve.fm

A work in progress

Issue with WordPress Plugins

One of the benefits of open-source software is that when things aren’t working as expected, you can fix it.

I noticed there was an issue with the accessibility of the site today when I tried to “tab” to the navigation menu. Whenever I hit the tab key, the focus would move to the first link on the page, not the navigation menu. Try as I might, I wasn’t able to access the menu via the keyboard even when I tabbed through the entire page.

When i looked at the site’s HTML, the answer became apparent very quickly: tabindex="-1". For posterity:

<li id="menu-item-1" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-1 active">
   <a title="Home" href="https://steve.fm/" tabindex="-1">Home</a>
</li>

Since I wasn’t generating the menu items myself, I could only assume it had to do with the plugin. I did some quick traversing of the files for a place where it said tabindex="-1" and I found it in the nav-menu-walker.php file in the plugin directory for My Bootstrap Menu.

//Menu Item with no children
else {
    $inner_atts_array['href'] = !empty($item->url) ? $item->url : '#';
    /*Review here*/
    $inner_atts_array['tabindex'] = "-1";
}

Apparently, they even had a comment to review the code… Who knows? Anyways, there was no reason to set the tabindex value there… being able to put it in focus doesn’t benefit us in any way.

Read more about Building Steve.fm