On Dec 20, 10:04 pm, Rob <[email protected]> wrote:
> I am having trouble getting my wordpress theme to use the Superfish in
> the nav menu. My problem is I have subcategories that go 3 tabs deep
> and currently it is very tough to navigate through the drop down menu
> so I wanted to get Superfish to work since I have used it with other
> non-Wordpress sites in the past.
>
> a link to the site I am working on ishttp://robgivans.com/hssportszone/
>
> I have called these files.
>
> //link to the CSS files for this menu type
> <link rel="stylesheet" type="text/css" media="screen"
> href="superfish.css" />
>
> // link to the JavaScript files (hoverIntent is optional)
> <script type="text/javascript" src="hoverIntent.js"></script>
> <script type="text/javascript" src="superfish.js"></script>
> <script type="text/javascript" src="supersubs.js"></script>
>
> Then right above my Navbar I have called the script file for super
> fish, this is exactly how it is in my file.
>
> <script type="text/javascript">
>
> $(document).ready(function(){
> $("ul.sf-menu").supersubs({
> minWidth: 12, // minimum width of sub-menus in em
> units
> maxWidth: 27, // maximum width of sub-menus in em
> units
> extraWidth: 1 // extra width can ensure lines don't
> sometimes turn over
> // due to slight rounding differences
> and font-family
> }).superfish(); // call supersubs first, then superfish, so
> that subs are
> // not display:none when measuring. Call
> before initialising
> // containing tabs for same reason.
> });
>
> </script>
> <div id="navbar">
>
> <div id="navbarleft">
>
> <ul id="nav">
>
> <li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
>
> <?php wp_list_pages('title_li=&depth=4&sort_column=menu_order'); ?>
> </ul>
> </div>
>
> </div>
>
> I have changed the DIV Navbar to sf-menu but it makes no difference.
> If you have any idea what I could be doing wrong please let me know, I
> have been messing with this way too long, maybe I am missing something
> stupid. Thanks.
I have used SuperFish menus in a couple WordPress themes which are
based on the Sandbox theme.
To get SuperFish to load correctly, I had to run this jQuery script:
// Need to initialize jQuery and the SuperFish menus
jQuery(document).ready(function(){
jQuery('ul.sf-menu').superfish({
delay: 250,
animation: {opacity:'show',height:'show'},
speed: 'fast',
autoArrows: true,
dropShadows: true,
pathClass: 'current_page_item'});
});
Your pathClass argument might be different depending on how your theme
assigns a class to the current page. It has been my experience that
you will not be able to use the jQuery $() shortcut notation with
WordPress because so many things make use of jQuery.
You can see SuperFish menus working with WordPress on this web site:
http://www.caslshocks.org
Mike