Admin Menu Dropdown onClick

[Brett]

Here is a nice hack for making the admin menu only drop down when clicked.

 

This has been tested and currently working with 3.6.2 Beta.

 

The Official Wiki Contribution Page. Keep an eye here for the latest changes.

 

There are two files that have to be changed.

 

Replace all text in the following file.

/admin/templates/topmenu.tpl

<span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu1, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Home</span><span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu2, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Clients</span><span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu3, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Orders</span><span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu4, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Transactions</span><span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu5, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Support</span><span class="navbutton" onMouseOver="this.className='navbuttonover';" onMouseOut="this.className='navbutton';" onClick="window.location='reports.php'"><a href="reports.php">Reports</a></span><span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu7, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Utilities</span><span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu8, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Configuration</span><span class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu9, '');" onMouseOut="this.className='navbutton';delayhidemenu();">Help</span>

 

Make the following changes to the next file

 

/admin/javascript/menu.js

 

Look for:

var menu5=new Array()
menu5[0]='<a href="supportannouncements.php">Announcements</a>'
menu5[1]='<a href="supportdownloads.php">Downloads</a>'
menu5[2]='<a href="supportkb.php">Knowledgebase</a>'
menu5[3]='<a href="supporttickets.php">Support Tickets</a>'
menu5[4]='<a href="supporttickets.php?view=Open"> - Open</a>'
menu5[5]='<a href="supporttickets.php?view=Answered"> - Answered</a>'
menu5[6]='<a href="supporttickets.php?view=Customer-Reply"> - Customer-Reply</a>'
menu5[7]='<a href="supporttickets.php?view=On Hold"> - On Hold</a>'
menu5[8]='<a href="supporttickets.php?view=In Progress"> - In Progress</a>'
menu5[9]='<a href="supporttickets.php?view=Closed"> - Closed</a>'
menu5[10]='<a href="supporttickets.php?action=open">Open New Ticket</a>'
menu5[11]='<a href="supportticketpredefinedreplies.php">Predefined Replies</a>'

 

Replace With:

var menu5=new Array()
menu5[0]='<a href="supportcenter.php">Support Center Home</a>'
menu5[1]='<a href="supportannouncements.php">Announcements</a>'
menu5[2]='<a href="supportdownloads.php">Downloads</a>'
menu5[3]='<a href="supportkb.php">Knowledgebase</a>'
menu5[4]='<a href="supporttickets.php">Support Tickets</a>'
menu5[5]='<a href="supporttickets.php?view=Open"> - Open</a>'
menu5[6]='<a href="supporttickets.php?view=Answered"> - Answered</a>'
menu5[7]='<a href="supporttickets.php?view=Customer-Reply"> - Customer-Reply</a>'
menu5[8]='<a href="supporttickets.php?view=On Hold"> - On Hold</a>'
menu5[9]='<a href="supporttickets.php?view=In Progress"> - In Progress</a>'
menu5[10]='<a href="supporttickets.php?view=Closed"> - Closed</a>'
menu5[11]='<a href="supporttickets.php?action=open">Open New Ticket</a>'
menu5[12]='<a href="supportticketpredefinedreplies.php">Predefined Replies</a>'

 

The need for the second file change is so it will add the supportcenter.php to the menu.

[othellotech]

if you add into topmenu

onMouseOver="this.className='navbuttonover';"

 

before the onclick it'll still highlight them with the mouse

[LemonBarley]

nice. i have added the plugin.

 

othllotech your instructions seems unclear...

[ChrisGooding]

Has anyone managed to get this working with V4?

 

I have tried making it work, but when I click the menu's instead of dropping down it goes to the page for the menu instead

[ChrisGooding]

Right, I have sussed it.

 

For those wanting to change get rid of the drop downs in the V4 Template, the changes seem to have to be made on a different file.... as it doesnt seem that the V4 template uses topmenu.tpl, instead the settings are on the header.tpl file .

 

Follow the below to get the menu's added....

 

Open templates>Admin>V4>header.tpl

Find:

<div id="navigation">
 <ul>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu1, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='index.php'"><a href="index.php" title="Home">Home</a></li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu2, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='clients.php'"><a href="clients.php" title="Clients">Clients</a></li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu3, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='orders.php'"><a href="orders.php" title="Orders">Orders</a></li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu4, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='transactions.php'"><a href="transactions.php" title="Billing">Billing</a></li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu5, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='supportcenter.php'"><a href="supportcenter.php" title="Support">Support</a></li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';" onmouseout="this.className='navbutton';" onclick="window.location='reports.php'"><a href="reports.php" title="Reports">Reports</a></li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu7, '');" onmouseout="this.className='navbutton';delayhidemenu();">Utilities</li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu8, '');" onmouseout="this.className='navbutton';delayhidemenu();">Setup</li>
   <li class="navbutton" onmouseover="this.className='navbuttonover';dropdownmenu(this, event, menu9, '');" onmouseout="this.className='navbutton';delayhidemenu();">Help</li>
 </ul>
</div>

 

And replace with:

<div id="navigation">
 <ul>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu1, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='index.php'">Home</li>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu2, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='clients.php'">Clients</li>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu3, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='orders.php'">Orders</li>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu4, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='transactions.php'"><a href="transactions.php" title="Billing">Billing</a></li>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu5, '');" onmouseout="this.className='navbutton';delayhidemenu();" onclick="window.location='supportcenter.php'">Support</li>
   <li class="navbutton" onClick="this.className='navbuttonover';" onmouseout="this.className='navbutton';" onclick="window.location='reports.php'">Reports</li>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu7, '');" onmouseout="this.className='navbutton';delayhidemenu();">Utilities</li>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu8, '');" onmouseout="this.className='navbutton';delayhidemenu();">Setup</li>
   <li class="navbutton" onClick="this.className='navbuttonover';dropdownmenu(this, event, menu9, '');" onmouseout="this.className='navbutton';delayhidemenu();">Help</li>
 </ul>
</div>

 

Obviously if you are using the enom extended plugin ensure that you change accordingly.

[neobug103]

I believe this is now outdated with the new menu file, can anybody provide any ideas on how to implement the same onclick in the new menu?