Jeca Design | Web & Print

Superfish Menu – Remove Top Level Arrow

I really enjoy using Superfish to create menus. It is a great tool for adding some great menu features. Recently, I had a project that required removing the nav arrows from the top-level only. These arrows tell the user whether the menu item has a sub-level, but the current client did not want this feature for the top-level items.

Pre-Req – Requires a beginner’s level knowledge of the following

  • WordPress 2.9+
  • HTML
  • jQuery/javascript
  • CSS

I searched the net for a solution, but failed to find a working one. I did find some references to help me in the direction, but the code was for a previous version of the Superfish menu script (see the references section for the link).

In order to remove the arrows change the following in superfish.js:

[php]if (o.autoArrows) addArrow( $(‘>a:first-child’,this) );[/php]


to this:

[php]if ((o.autoArrows) && ($(‘ul .sub-menu li:has(ul)’,this).length == 0)) {addArrow( $(‘>a:first-child’,this) );}[/php]


This works using the WordPress 3.0 menu system, but could be easily changed by editing “sub-menu” to whatever class is wrapped around the 2nd level items.



About the Author:

0 Pings & Trackbacks

Leave a Reply