Page 1 of 1

Make the menu more accessible

Posted: Mon Nov 07, 2016 7:58 pm
by Yoderman94
I am trying to make a Joomla menu more accessible. I am using Bootstrap 3 and letting Joomla generate the menu and dropdowns but I need to add ' data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" ' to the top level href among some other aria elements (See example below). However cannot figure out how to use the template overrides to input the information I need. I would prefer not to have to code the menu manually but I will if I have too.

Code: Select all

<ul class="nav  navbar-nav" >
   <li class="dropdown">
      <a href="#" 
         id="toplevelitem" 
         class="dropdown-toggle" 
         data-toggle="dropdown" 
         role="button" 
         aria-haspopup="true" 
         aria-expanded="false"
      >
       Top Level Item
       <span class="caret"></span></a>
       <ul class="dropdown-menu" role="menu" aria-labelledby="toplevelitem">
          <li role="presentation"><a role="menuitem" href="#">Item 1</a></li>
          <li role="presentation"><a role="menuitem" href="#">Item 2</a></li>
          <li role="presentation"><a role="menuitem" href="#">Item 3</a></li>
       </ul>
   </li>
</ul>


Re: Make the menu more accessible

Posted: Mon Nov 07, 2016 10:04 pm
by numinousmedia
When you say "letting Joomla generate the menu and dropdowns", what do you mean? Generally, the menu is contained in a menu module. Is it the default menu module that you are using? If so, you'd probably want to create a template override for mod_menu to allow you to add those attributes in. Here's documentation on creating those overrides: https://docs.joomla.org/How_to_override ... omla!_core

Re: Make the menu more accessible

Posted: Mon Nov 07, 2016 10:49 pm
by CircuitoX
Personally I not like bootstrap, if you wan a responsive dropdown menu for joomla, you can use this (free)

Demo:
http://clickmyweb.net/demos/hmenu/

Tutorial:
https://youtu.be/x193me1ioMo

Download:
http://clickmyweb.net/download

Re: Make the menu more accessible

Posted: Tue Nov 08, 2016 10:45 am
by Yoderman94
@numinousmedia I thought my question was more clear than it was. Yes I am using a menu module and as I stated in the original question I cannot figure out how to get the template overrides to work. I have used template overides in the past and have a modifed version I use for every template I built. However this client needs more accesability than I can provide out of the box. Therefore I don't know how or where the href is being created nor how to insert the code I need inline with it. Everything I have tried hasn't worked.