Ryan Hellyer

<?php if (function_exists('suckerfish')) {suckerfish();} ?>

243 Responses to “WordPress Dropdown Menu Plugin”

1. 

   Chris says:

   Hey Ryan,

   I’d really love a nicer-looking version of this plugin. Drop-downs are pretty cool, so keep working on it an it could end up being a really popular gizmo!

   January 14, 2008 at 10:29 am # // Reply

2. 

   str3ss says:

   Hey Ryan ::

   This look interesting!

   Like the idea of SuckerFish + WordPress, good stuff!

   I took a look at your demo in Safari 3 (Win/Mac) and the nav positioning is off about 20px to the left.

   Can’t wait to try this on some of my WP installs. This is a fantastic idea, thanks for doing the dev!

   January 16, 2008 at 1:52 am # // Reply

3. 

   Ryan says:

   Good to see you guys like the concept. I’ve now updated it with a much better looking design and it works in all browsers I’ve tested on so far (IE6, IE7, FF2, Safari3, Opera9).

   January 19, 2008 at 8:38 am # // Reply

4. 

   witchypoo says:

   I would love to have a home link on my navigation bar. Love the plugin!

   January 21, 2008 at 11:55 pm # // Reply

5. 

   Ryan says:

   Glad to hear you like the plugin 🙂 I’ll provide an example of how to add a home page button on the demo page tonight.

   EDIT: New version has this functionality built in via the function suckerfish().

   January 22, 2008 at 1:41 am # // Reply

6. 

   Ryan says:

   I’ve uploaded version 1.03 of the plugin. The new version essentially functions the same, but I’ve added a simplified method for displaying the various menu options. Hopefully this will make things a little easier for beginner WordPress’ers.

   EDIT: We’re now up to Version 1.04 as I had to do a bunch of modifications under the skin for submission to the Official WordPress Plugins directory

   January 22, 2008 at 5:33 am # // Reply

7. 

   witchypoo says:

   Because the navbar uses the entire width of the layout, and Categories is the last item on it, the sub sub menus fly out to the right, so are unreadable. I think I can fix that in the css, but you may want to consider it as you have for including a home link. Again, I fixed that myself, but some folks are scared to mess with CSS.
   I like the one line of code, I might just swap it out with the code I put in yesterday, should I de-activate the plugin first?

   January 22, 2008 at 1:54 pm # // Reply

8. 

   BG says:

   Hi, wondering where exactly in the header.php file one should place your code in?

   January 22, 2008 at 8:35 pm # // Reply

9. 

   Ryan says:

   witchypoo – I hadn’t thought of the sub menus blowing out the side of the screen like that. The easiest solution to get around that is to decrease the font size in the CSS a notch or two. To use the simplified template code, you need to download the new version of the plugin and replace you existing files with it. You don’t need to deactivate and reactivate it, the changes will be automatic. Your old code will still work with the new plugin too, so if you change your template code after installing the new plugin you won’t have any downtime. But if you use the new code now your WordPress install will probably report an error I assume (I haven’t tried it).

   BG – Where you put the code is entirely up to you. It depends on where exactly in your blog you want it to appear. Usually you would place it towards the end of the file. If you would like specific help with your theme, drop me a line via my contact page and I’ll help you from there.

   January 22, 2008 at 8:53 pm # // Reply

10. 

    BG says:

    If I want it to appear in the header horizontally in the header of my kubrick theme. Where in the header.php file should I place it. What codes near it should I look for.

    January 22, 2008 at 9:25 pm # // Reply

11. 

    Ryan says:

    Edit: I tested this tonight and found you need to clear your floats or the search box will blow out the side of the page. I’ve edited the code below accordingly.

    The Kubrick theme is slightly annoying this regard as it doesn’t have a fixed width box to plonk your content in, or at least it does, but that box includes the graphical borders which you won’t want your menu obscuring. But you can get around this by using a DIV tag with margins to pull the edges of the menu in as follows:

    Below this section of code in your header.php file:
    <div id="page">
<div id="header">
<div id="headerimg">
<h1><a href="https://ryan.hellyer.kiwi/test/wordpress1/">Ryan’s test blog</a></h1>
<div class="description">This is Ryan’s blog for testing out WordPress stuff</div>
</div>
</div>
<hr />

    Place the following code:
    <div style="margin:0 25px;">
<?php suckerfish(); ?>
</div>
<div style="clear:both;"></div>

    That should place the menu nicely underneath the main header for you. I haven’t test it though, so if it doesn’t look correct then let me know.

    January 22, 2008 at 11:17 pm # // Reply

12. 

    Istvan says:

    Nice plugin, I will surely try it…is possible to display only categories with sub-categories as drop down?

    Thanks

    January 24, 2008 at 3:15 am # // Reply

13. 

    Ryan says:

    Yes that is possible. It’s not one of the default functions, but it’s quite easy to do. I am busy right now, but I’ll leave a comment later on tonight with instructions on how to do it and will include this functionality in the next version for you.

    January 24, 2008 at 9:35 am # // Reply

14. 

    Ryan says:

    Istvan, to add a list of categories with your sub-categories in a dropdown, use the following code:

    <ul id="suckerfishnav">
<?php wp_list_categories('title_li='); ?>
</ul>

    There’s now a demo of this on the demo page

    January 24, 2008 at 7:30 pm # // Reply

15. 

    Istvan says:

    Thanks for the fast reply, I will try it on my local installation.

    January 25, 2008 at 7:46 am # // Reply

16. 

    Theo says:

    Ryan,
    I love this plugin – it solves a HUGE problem for me. I’m using the indomagz theme. The old nav bar had this code:

    <a href=””>Home

    I replaced the code to read this:

    But when I do that, the rest of the content on the page disappears! Do you have any idea why this might be happening?

    January 25, 2008 at 10:58 am # // Reply

17. 

    Clarissa says:

    Hey Ryan! Useful, wonderful plug-in, but I haven’t been able to get it to show more than 2 pages at a time. I have about 4 links in a sub-category here. Could it be because they are linked to an outside page?

    January 25, 2008 at 11:04 am # // Reply

18. 

    Ryan says:

    Hi Theo,
    WordPress has removed most of your code from your comment unfortunately so I can’t answer your question.

    I’ll download the indomagz theme in a few hours and have a look and see if I can sort a solution for you.

    January 25, 2008 at 11:19 am # // Reply

19. 

    Theo says:

    Argh!! Thanks SO much for taking a look – I can email you the code if you’d like as well.

    January 25, 2008 at 11:52 am # // Reply

20. 

    Ryan says:

    Clarissa – have you hacked the WordPress core by any chance? I see that you have a bunch of doubly closed link tags which may be causing problems. If you are trying to change the look of the dropdown, try altering the CSS file supplied with the plugin (you can write over the existing one).

    Which dropdown isn’t functioning correctly? And what code did you use to display it? – note: it’s tricky to display HTML and/or PHP here in the comments without the code disappearing so feel free to provide a link to it instead.

    January 25, 2008 at 12:15 pm # // Reply

21. 

    Ryan says:

    Theo – that was a VERY bizaare problem!

    It turns out that your theme behaves rather strangely when floats are added to the layout. You can get around this issue by adding clear:both; to the content-wrapper ID in your themes CSS file as follows:

    #content-wrapper {clear:both;padding: 20px 0px 20px 0px; background: #ffffff; overflow:hidden;}

    You will also likely have some problems associated with your theme specifying styling for unordered lists, so it would pay to specify that styling only for the main content area. You can do this by editing the CSS file in your theme as follows:

    #content-wrapper ul{list-style:square;padding:0px; margin:0px 0px 0px 0px;}
#content-wrapper ol{padding:0px; margin:0px 0px 0px 10px; }
#content-wrapper li{margin: 0px 0px 0px 20px; padding: 0px 0px 0px 0px;}

    If you replace the existing menu bar including it’s border (#navbar) the menu should appear correctly. However if you place it inside the #navbar DIV tag it will probably not display correctly as for some reason they have specified overflow:hidden on that box. To correct this you will need to edit #navbar in your themes CSS file as follows:

    #navbar {background: #ECF3F8;font-size: 12px;font-family: Arial, Tahoma, Verdana;color: #444;font-weight: bold;padding: 8px 0px;border: 1px solid #b0c4de; }

    Other themes should be a lot easier to use the plugin for. This is a particularly tricky one that’s all.

    January 25, 2008 at 2:00 pm # // Reply

22. 

    Jonathan Babcock says:

    Ryan,

    I absolutely love the plugin. I have found one minor, though, that I hope you can help with.

    First of all, on my site, the suckerfish dropdown doesn’t drop below the original nav bar item. It covers it up, taking away the ability to access the parent page. I’ve tweaked all I can think to tweak in the CSS, but just can’t work it out.

    I’ll be grateful for any help you can provide on this.

    I’ll leave the menus as-is on my site in case you get a chance to take a look.

    January 25, 2008 at 7:00 pm # // Reply

23. 

    Ryan says:

    Jonathan – I love your implementation 🙂 The blue styling looks brilliant. I’ll take a look now and see if I can figure out a solution for you and will post back later.

    January 25, 2008 at 7:20 pm # // Reply

24. 

    Ryan says:

    Jonathan – I’m stumped. When I try to fix one thing in your menu, something else goes wrong 🙁 I’ll leave it and come back to it later. Hopefully settling my brain will help bring the solution to the surface 🙂

    January 25, 2008 at 8:36 pm # // Reply

25. 

    Theo says:

    Ryan-YOU ROCK! Thanks very much! The final implementation will be at http://www.awakenthesleeper.com if you’d like to check it out. I put it in and it works, just need to tweak the look. This solves a huge stumbling point for me with WordPress. Thanks so much!

    January 26, 2008 at 5:16 am # // Reply

26. 

    Jonathan Babcock says:

    Ryan,

    Thanks for taking a look, and thanks for the compliment on the colors. It does look great and fits right in with the rest of the theme.

    RE: the dropdown issue, I’m hoping it isn’t a core theme issue. I don’t like fiddling around too much in the theme’s framework. I also wondered if it might not be something to do with my theme’s CSS, but if it is, it isn’t obvious. I’ve tweaked everything I thought might do the trick.

    Anyway, I’m grateful for any time you can spare to look into it.

    January 26, 2008 at 2:29 pm # // Reply

27. 

    Ryan says:

    Hi Jonathan,
    I gave up on integrating it with your theme for the mean time and rebuilt the menu to look like yours from scratch. Here’s the final result … https://ryan.hellyer.kiwi/test/wordpress1/babcock-style/

    Do you mind if I can include this style with the plugin? I plan to add a few more styles over time and this would be a good one for that purpose.

    It’s definitely not a core issue with WordPress, but I’m pretty sure it’s a problem related to the way your theme is inadvertently styling things inside the menu. I’ll see if I can get my new version to work with your theme and will post back later on.

    January 26, 2008 at 2:52 pm # // Reply

28. 

    Ryan says:

    Jonathan – I’ve knocked together a very crude mockup of your menu jerry rigged into your theme. I removed a bunch of scripts and other stuff which was taking too long to load while I was testing, but otherwise it’s essentially a replica of your home page.

    Mockup »
    CSS file »

    I changed the #nav and .stopper in your theme to #znav and .zstopper and added some styling to them to fit the menu into the correct position. Another option is to replace those styles with the ones I’ve used for #znav and .zstopper.

    Let me know if you have any more problems or if there are any issues with the demo above.

    January 26, 2008 at 8:34 pm # // Reply

29. 

    Barbara Ling says:

    Ryan,

    Super super plugin!

    I have a question – let’s say that I have two categories with 4 subcategories like so:

    Dogs
    Basset Hounds
    Akitas
    Bulldogs
    Birds
    Parakeets

    How can I get a nested Suckerfish dropdown that drops down and then populates to the right?

    Thank you for your time,

    Barbara

    January 27, 2008 at 12:31 pm # // Reply

30. 

    Jonathan Babcock says:

    Thank you so much for you help and your responsiveness! I added the new styles you provided and the menu is “dropping down” correctly.

    It is rendering perfectly in IE, but the vertical alignment seems to be a little off in firefox.

    I will goof with it some more, though. I know it’s only a matter a tweak or two to getting it perfect.

    Anyway, I really appreciate you taking the time to help me get this working correctly.

    As far as the look of the nav bar on my site goes, credit Michael Pollock who designed the theme. I just goofed with the colors of your great plug in to get it to blend in nicely.

    Again – great plugin. Looks great, easy to use, and your support has been second to none.

    January 27, 2008 at 5:03 pm # // Reply

31. 

    Ryan says:

    Barbara – I’m not 100% sure what you are asking. Do you want a dropdown which only features categories on the top level and has their sub-categories in the dropdown, with futher nested categories in the flyouts to the right?

    If so, then the following code should do the trick:

    <ul id="suckerfishnav"><?php wp_list_categories('title_li='); ?></ul>

    There is a demonstration of this on the demo page near the bottom.

    January 27, 2008 at 6:25 pm # // Reply

32. 

    Ryan says:

    Jonathan – no problem, I’m happy to help 🙂

    I’m assuming you must be working on it at the moment as it’s more than “a little” out in Firefox at the moment! I also noticed the flyouts are way off in IE7.

    As for the plugin being easy to use, that should be improving further in the future too. I’m working on a system to allow you to edit the look of it directly from the admin panel rather than goofing around with CSS files. I’m not sure when it will be ready though.

    January 27, 2008 at 6:29 pm # // Reply

33. 

    Cj B says:

    There seems to be a problem in the plugin. If you have your wordpress directory set to something besides your blog address. It does not use the correct URL to access the CSS, etc.

    January 30, 2008 at 8:59 am # // Reply

34. 

    Cj B says:

    Just a quick followup. You should be using “wpurl” on line 40 and 41.

    January 30, 2008 at 9:02 am # // Reply

35. 

    Ryan says:

    Thank you Cj B.

    I wondered if that would cause problems, but when I looked up how another plugin coded this, they used the method which I employed. I guess we had it both wrong then.

    Thanks for the correction 🙂 I’ll upload a new version of the plugin tonight.

    January 30, 2008 at 11:42 am # // Reply

36. 

    Ryan says:

    Version 1.0.5 is now uploaded. The only change is to fix the bug Cj B pointed out above. The corrections did not apply to lines 40 or 41 though, but much further up in the code.

    If the plugin was working fine for you before, then there is no need to upgrade. The bug fix only applies to situations in which your blog address is different from your WordPress address.

    January 30, 2008 at 7:07 pm # // Reply

37. 

    Albert says:

    Great Plugin! Is there a way to highlight the active page?

    January 30, 2008 at 7:10 pm # // Reply

38. 

    Ryan says:

    Albert – thanks.

    I haven’t thought about whether it is possible to highlight the active page. It is probably possible if you only want “WordPress Pages” in your dropdown navigation. But I’m not sure about other things like Categories, Archives etc. I’ll have a look into it though and see what I can come up with.

    One of the reasons I hadn’t considered this before though, is that you can’t see what the active page is unless it is a page on the top level of your menu or if you open the dropdown. Most dropdowns don’t bother with highlighting the active page for this reason.

    January 30, 2008 at 9:55 pm # // Reply

39. 

    joell says:

    great plug in!!! works like a charm.

    just one question…I have several catagories under my blogroll & would like each of the categories to have their own drop down. Right now the plug in just bunches them all together.

    for example I have one catagory that is “fav blogs” & another that is “fav websites”. Can I make each have it’s own drop down list?

    January 30, 2008 at 11:23 pm # // Reply

40. 

    Albert says:

    Good point, Ryan. I was indeed referring only to Pages. But now that i think of it, there might be a problem with “child” pages.

    January 31, 2008 at 8:41 pm # // Reply

41. 

    Ryan says:

    Joell – that definitely sounds possible. I’ll try to get this going this afternoon and will post a new version of the plugin once/if I get it sorted out.

    February 1, 2008 at 9:16 am # // Reply

42. 

    Ryan says:

    I’ve found some complications with displaying blog rolls in their categories. I can display the categories in flyouts as requested, but any links which aren’t categorized are not displayed at all 🙁

    Joell – if you would like a copy of the plugin which works with categories, but features the bug which causes the links not in categories to be invisible, then leave me a message via my contact form and I’ll put something together and email it to you.

    February 2, 2008 at 12:45 am # // Reply

43. 

    rizal says:

    hello ryan,
    thanks for your suckerfish plugin…it very cool

    actually, i tried to make some experimen on theme blog oh blog (bob. i read and follow the instruction given). i put the code ” on the header. but following message appears

    “Parse error: syntax error, unexpected ‘>’ in /home/komen/public_html/wp-content/themes/bob/header.php on line 12”

    so, kindly you give me some extra tips to ensure your vety cool code be implemented in my site?

    thank you..

    February 3, 2008 at 2:53 pm # // Reply

44. 

    Ryan says:

    Hi Rizal,
    I’m glad to hear you like the plugin … although it’s a pity it is not working for you yet.

    I downloaded the “Blog Oh Blog” theme, and it seems that header.php is most likely not the file you want to put your menu in. The menu which comes with the theme is stored in a file called menu.php

    If you remove all of the code from that file and replace it with the following, it should work … I think, I haven’t tried it myself.
    
<div id="nav">
<?php suckerfish(); ?>
</div>


    This should not give you any parse errors. But it may look a little wonky and if so let me know and I will investigate further.

    February 3, 2008 at 6:11 pm # // Reply

45. 

    Rizal says:

    Hi, Ryan..thanks for your advice

    you said that the menu which comes with the theme is stored in a file called menu.php

    i’ve recheck all the .php script in “BOB”, and not found where’s that menu.php is located. here i show you what i’ve found in “BOB” php script

    404
    archieve
    archieves
    category
    comments
    footer
    functions
    header
    index
    lsidebar
    page
    rsidebar
    search
    searchform
    sidebar
    single
    sitemaps
    tag

    or,should i create new php code called menu.php to ensure your very cool code works?

    thank you

    February 4, 2008 at 2:07 pm # // Reply

46. 

    Haven Rich says:

    I’ve used this on one of the sites I’ve created and it looks great, but I’m not really a huge fan of the Archives and Categories on the menu. What coding needs to be removed to take those off?

    BTW, I’ve tried to slice the coding, but it doesn’t work so I thought I’d ask for advice here.

    February 8, 2008 at 4:17 pm # // Reply

47. 

    witchypoo says:

    Hi Ryan. Love your plugin. We have another live site for you, and it looks purdy too.
    http://www.dutchblitz.net/
    I have a question though. This site has archives since 2006. Is there a way to code the archives so that there is a submenu (flyout) for the months of each individual year? I know how to do this in CSS unordered lists, but php? Not so much.
    And she has a fair amount of archives.

    February 8, 2008 at 6:27 pm # // Reply

48. 

    Ryan says:

    Haven Rich, what exactly do you want on the menu? There are various options available which can be seen on the demo page. If none of them match what you are looking for, then just let me know and I’ll either add them to the plugin or provide you with a custom code to display them (assuming it is something which is possible).

    Witchypoo – I’ll post back later in the evening with instructions on how to change the archives. I can’t remember off the top of my head how to do it, so will need to look it up first.

    February 8, 2008 at 7:14 pm # // Reply

49. 

    Ryan says:

    http://www.dutchblitz.net/ has now been added to the list of live examples.

    February 8, 2008 at 7:15 pm # // Reply

50. 

    Ryan says:

    Witchypoo – I haven’t figured out how to do the years as flyouts, but I have figured out how to add them as plain yearly links instead of monthly ones. The following code will do the job, just replace it instead of the <?php suckerfish5() ?> code I assume you were using before.

    <?php
echo '<ul id="suckerfishnav">
<li><a href="' , bloginfo('url') , '/">Home</a></li>
' , wp_list_pages('title_li=') , '
<li><a href="#">Archives</a>
<ul>' , wp_get_archives(type=yearly) , '</ul>
</li>
<li><a href="#">Categories</a>
<ul>' , wp_list_categories('title_li=') , '</ul>
</li></ul>' ?>

    I haven’t tested this, so just let me know if it doesn’t work and I’ll look into it.

    February 8, 2008 at 7:40 pm # // Reply

51. 

    witchypoo says:

    Well, actually, I miscommunicated. Each year should be a submenu item, with the months for that year as the flyouts.

    February 8, 2008 at 8:26 pm # // Reply

52. 

    Ryan says:

    Witchypoo – No, you communicated fine. I just haven’t figured how to do that yet.

    February 8, 2008 at 9:39 pm # // Reply

53. 

    Ryan says:

    The plugin is now available in the official WordPress Plugins Repository.

    Please keep leaving any questions/comments about the plugin here though.

    February 9, 2008 at 7:44 pm # // Reply

54. 

    Ryan says:

    I was hoping someone had combined suckerfish and WP. I’m going to try to incorporate this into my next WP theme design and see how it goes. If styled right, I think it could be a great addition to any WP theme.

    February 10, 2008 at 10:44 am # // Reply

55. 

    Ryan says:

    Glad you like my plugin Ryan. Let me know once you get it up and running and I’ll add your link to my examples list.

    February 10, 2008 at 1:59 pm # // Reply

56. 

    Iva says:

    Amazing plugin which saves a huge amount of time. Thank you:)

    P.S. I also wanted to tell you that you forgot the apostrophe in the plugin’s name on WordPress extend page.

    February 11, 2008 at 4:32 am # // Reply

57. 

    Ryan says:

    Glad you like it. Thanks for the correction 🙂 I’ll fix it during the next update.

    I don’t like the plugin name at all. I hadn’t realised how silly it would look in the main WordPress plugin index without a simple self-explanatory name. I can’t figure out how (or if it is possible) to change it now though 🙁

    February 11, 2008 at 11:43 am # // Reply

58. 

    Istvan says:

    I have another question…is possible to have the drop down menu not in fixed width but relative to the word?

    For example: “About me” will be on one row
    “my interestes, books..” will be two row

    Obviously I can increase its width but the first one will have a lot of empty space at the left side of the word…

    Thanks 🙂

    February 13, 2008 at 1:34 am # // Reply

59. 

    3m says:

    This is a great plugin, thanks!

    It works for me but something is causing my drop downs to go behind my middle column. I don’t have the drop downs live on my site yet because of this, but if you could give me some ideas on how to get around this, I’ll definitely put them in.

    Love it!
    http://1morechapter.com

    February 14, 2008 at 5:01 am # // Reply

60. 

    Chris says:

    Hi, Great menu. I was wondering if its possible to add some bullets or image bullets preferably to the dropdown links? I tried adding some list styles to the CSS file but it doesn’t seem to stick.

    Thanks!

    February 14, 2008 at 5:09 am # // Reply

61. 

    3m says:

    OK, I researched and found that if I put

    z-index: 99;

    into the first line before the margin, it seems to work.

    February 14, 2008 at 6:27 am # // Reply

62. 

    3m says:

    If you can’t do this, it’s no big deal (I was too afraid to try it myself), but I’d like an option with Pages, Categories, Blogroll, Archives. That would be perfect for me!

    I understand if you are too busy to do that.

    Thanks for a fabulous plug-in!

    February 14, 2008 at 8:26 am # // Reply

63. 

    Ryan says:

    Hi everyone,
    I’m a little busy right now, but I’ll try to sort out the things you have asked for.

    3M – what you have asked for isn’t very difficult so I’ll definitely get on to that. If I don’t post back here with a solution tomorrow then send me a message via my contact form to remind me.

    February 14, 2008 at 9:10 am # // Reply

64. 

    3m says:

    I had to deactivate it temporarily because when I clicked on a single post entry, the post wouldn’t show up. I’ll work on it.

    February 14, 2008 at 9:36 am # // Reply

65. 

    3m says:

    Whatever is happening is only occurring with firefox. In internet explorer it is okay. When I click on a single post entry, all I get is white space.

    This may have something to do with it: It must be in my layers. I have a ‘falling hearts’ effect that is going on the top of my left sidebar, behind my middle column, and somewhere in the middle of my third column. If I can fix the layers, the evidence being that the hearts fall on top of all three columns, the plugin will probably work for firefox. I could try it with another theme. It’s probably in the theme code, though I’ve been having problems with firefox stuff lately (usually it’s IE).

    Arrgh!

    February 14, 2008 at 10:41 am # // Reply

66. 

    Ryan says:

    3m – I don’t understand. Do you have a test site? Or should I be able to see the problem on http://1morechapter.com/?

    February 14, 2008 at 11:08 am # // Reply

67. 

    3m says:

    Yes, if you go to my site, the hearts are falling, but they go in front of the text in my left sidebar, and when they reach my main column, they disappear behind the container instead of going in front of the text. In the right column, you can see they’re in between the background and the text. I think it has something to do with my layers. Again, this is just in firefox, not in IE.

    I had to disable the drop downs temporarily because when I click on a single post, I didn’t get it OR the sidebars. Just the white container.

    February 14, 2008 at 12:15 pm # // Reply

68. 

    Ryan says:

    That sounds like a Z-index problem most likely. If you don’t have it sorted by tomorrow I’ll take a look and see if I can sort a fix for you.

    Nice touch for your theme by the way. The hearts certainly do make your site stand out.

    February 14, 2008 at 1:17 pm # // Reply

69. 

    Ryan says:

    3m – I had a quick look now, and I suspect your .postspace2 or #content in your CSS has a Z-index higher than those hearts. If you try changing your Z-index for those, you should be able to fix the hearts problem (I think). Hopefully it doesn’t break something else in the process though!

    February 14, 2008 at 1:19 pm # // Reply

70. 

    3m says:

    I think everything is working now. It was an overflow hidden issue. Pretty dumb reason–I’m no coder.

    February 14, 2008 at 8:30 pm # // Reply

71. 

    bug says:

    Hey…great plugin..Really useful 🙂

    One question: How would one go about adding a 500ms delay to the mouseout? I’m pretty brain dead when it comes to JS and I haven’t had much luck getting it to work.

    February 15, 2008 at 11:18 am # // Reply

72. 

    3m says:

    I’m loving this plugin! Just wanted to know if it’s possible to tweak it so that if you have more than 15 items on the “wing out” that it adds another column on the wing so it doesn’t go below the bottom of the monitor. For instance, I have ‘authors a-z’ in my categories, with 26 for each letter. If I could display it in two columns it would be great and a lot easier to see. About 15 would work for me if it’s possible. That way I’d have one column with 15 and one with 11.

    Just thought I’d ask! If it can’t be done I’ll work around it.

    http://1morechapter.com

    February 15, 2008 at 1:18 pm # // Reply

73. 

    Ryan says:

    3m – here’s some code to display Pages, Categories, Blogroll and Archives …

    <ul id="suckerfishnav">
<li><a href="#">Pages</a>
<ul><?php wp_list_pages('title_li='); ?></ul>
</li>
<li><a href="#">Categories</a>
<ul><?php wp_list_categories('title_li='); ?></ul>
</li>
<li><a href="#">Blogroll</a>
<ul><?php wp_list_bookmarks('title_li=&categorize=0'); ?></ul>
</li>
<li><a href="#">Archives</a>
<ul><?php wp_get_archives(); ?></ul>
</li>
</ul>


    February 15, 2008 at 2:03 pm # // Reply

74. 

    Ryan says:

    3m – the double columns you are asking for in the dropdown would be tricky. It may be possible to do this by applying a width to each item and then floating them left or displaying them inline to cause them to show as two columns. This should be possible to do by modifying the CSS file, but you will need to know quite a lot about CSS to do it and it’s not something I intend to do myself.

    Bug – I also know very little about Javascript. The Javascript for this plugin is borrowed from elsewhere and doesn’t do anything more than correcting bugs in very old browsers. If you find a way to create a delay, I’d love to hear about it!

    February 15, 2008 at 2:20 pm # // Reply

75. 

    Ryan says:

    Istvan – sorry, but I don’t understand your question.

    February 15, 2008 at 2:34 pm # // Reply

76. 

    Ryan says:

    Chris – I had a brief go at getting list styles to work but had a few issues. An easier way to achieve this affect I found was to apply the :before pseudo class to the links like so:

    #suckerfishnav li li a:before {content: url(bullet.gif)}
    The code is edited in the CSS file which came with the plugin

    This solution won’t work in IE though.

    February 15, 2008 at 11:08 pm # // Reply

77. 

    3m says:

    Thanks for the code, Ryan! I probably won’t do it immediately because I’ll have to break down my blogroll into smaller categories for all of them to fit. That’s what I did with my a-z authors and titles. I just split them in half and that seems to work well.

    Thanks again for a wonderful plug-in!

    February 16, 2008 at 2:43 am # // Reply

78. 

    Umj says:

    how could i replace the current horizontal menu with this one?

    when i include the code in the header.php… i end up with 2 horizontal menus.

    tks

    February 16, 2008 at 3:18 am # // Reply

79. 

    Ryan says:

    Umj – are you referring to the code I posted for 3m above? If so, just remove the code from your header.php as that is what is being replaced by the code I provided above.

    February 16, 2008 at 8:41 am # // Reply

80. 

    Wac says:

    Ryan – I love this plugin it works like a charm – exept on my modified old mambopress theme. I cant make it do the drop-down….. Can You see whats going on in there? The suckerfish is on the top menuline. Thanks for all your hard work on this!!

    February 17, 2008 at 10:49 am # // Reply

81. 

    Ryan says:

    Wac – I can see the following error in your theme …

    <ul id="mainlevel-nav">
<li class="<ul id="suckerfishnav"><li>

    It looks like you have placed the plugin code inside a class statement for your list. The plugin must be outside of the list entirely.

    Leave another comment if you can’t figure out how to fix it and I’ll look up the theme and send you the exact code you need to get it to work.

    February 17, 2008 at 6:56 pm # // Reply

82. 

    steve says:

    Hi Ryan,

    Can I pick your brains?

    I’ve just come across your wonderful plugin and hoping it can do what I want on this site (www.pepperedsprout.com)

    It’s built in wordpress(duh)and had a previous incarnation when I was asked if I could change the menu. I’ve installed your plugin and can’t seem to get it to work as I envisaged.

    There’s only going to be 3 menu items(horizontal)… about, publishing, and CV – and what’s required is a dropdown appearing on the rollover on the ‘publishing’ – can this be done?

    thanks in advance
    Steve

    February 19, 2008 at 3:29 am # // Reply

83. 

    Ryan says:

    Steve – All I see is an “Under construction” message on your site along with your contact details.

    February 19, 2008 at 10:02 am # // Reply

84. 

    DanielRiem says:

    Ryan,

    Thanks for the plugin. You are one of the few people to make a drop down menu. Thanks.

    My big hangup is that the font and tab size are too big. Any way to change that? Where?

    February 20, 2008 at 2:52 pm # // Reply

85. 

    Ryan says:

    DanielRiem – When I designed the plugin, I made it work with the default Kubrick theme. Unfortunately it sets a very small font-size which affects this plugin. I will be correcting this in a future version which will be release some time in the next month or so.

    In the mean time, you can change the font size and the width of the dropdown menu by editing the ryans_suckerfish.css file (found in the plugin folder).

    Here’s the code you need to edit for the font size:
    #suckerfishnav { ... font-size:1.3em;}

    And here’s the codes you need to edit to change the width of the dropdown:
    #suckerfishnav li li {... width:9em; ...}
#suckerfishnav li ul a {width:9em;}
#suckerfishnav li ul ul {margin:-1.50em 0 0 10em;}

    If that doesn’t work, then let me know as I may have made an error.

    February 20, 2008 at 3:02 pm # // Reply

86. 

    Leo says:

    Hey Ryan,
    I was wondering if you could help me,
    have taken a look at your plugin and really like it, however I don’t like the
    fact that it makes use of javascript for the older browsers.

    I have seen cross browser drop down menus that just make use of CSS. A great
    website with examples is cssplay.co.uk. The only problem I face is that the
    markup that those menus use are different to the markup that is outputted by
    wordpress. I thought it would be near impossible to change the outputted mark
    up of wordpress but apparently not. Whilst searching the net I have come across
    another plugin at this address
    http://www.thanhsiang.org/faqing/node/58#comment-353

    When I took a look at the coding it seems that this plugin makes use of one of
    the menus found on CSS Play
    (http://www.cssplay.co.uk/menus/drop_examples.html)
    but has been altered but the markup has been altered slightly again and so it
    has lost its cross browser functionality.

    I myself am a complete newbie at php and so my knowledge is very limited. I am
    trying to build a theme for wordpress which is completely cross browser
    compliant which makes use of just CSS. I have gotten pretty far although I am
    stuck now as I am unable to build a menu system that works the way I want it
    to.

    You can see two versions of my design at
    dingo-style.com and http://www.richardpearse.co.uk

    I was wondering if you would perhaps be able to help me out?

    February 20, 2008 at 6:21 pm # // Reply

87. 

    Ryan says:

    Leo – from what I can see of the dropdown you linked to, it seems to be using the same approach that I am, but without using Javascript to help out older browsers, so I am assuming it will break in IE6 and older – I haven’t checked this though (I’ll have a look tonight to confirm).

    Thanks for the link by the way. The only other dropdown plugin for WordPress I had seen was the JQuery Dropdown Plugin.

    Stu Nicholls at CSS Play uses HTML tables hidden inside IE conditional comments to create the dropdown with Javascript. This does allow users of very old browsers to use your menu even without Javascript, but this is at the expense of a bunch of non-semantical HTML being jammed in between conditional comments. Most people (including myself) prefer the Suckerfish approach, ie: using Javascript to help out IE6 and older. There are merits in Stu Nicholls approach though.

    Dropdown menus by their very nature are notoriously non-browser compliant and will be for quite a few years to come. For example most cellular phones, PDA’s and other mobile devices will struggle to render them correctly. So if you are looking for the most cross browser design possible, then I suggest not using a dropdown at all.

    I have no idea how to change the output of the HTML lists that WordPress generates. These would need to be altered to use the CSS Play style menus. I’m sure it is possible, but I think you would probably need to hack the WordPress core files to do it.

    EDIT: for any of you who are interested in learning about the finer points of designing non-suckerfish dropdown menus, Stu Nichols website (CSSPlay.co.uk) is a wonderful resource. He truly is the master of cross browser compliant dropdowns which work in older browsers without javascript on. Personally I’m not a fan of this approach, but like I said above, it does have it’s merits. Even if you aren’t interested in using his technique, his site has some brilliant examples of what can be done with a bit of lateral thinking.

    February 20, 2008 at 6:23 pm # // Reply

88. 

    Ryan says:

    I’ve had a closer look at the plugin you linked to. But it looks like it is also a suckerfish dropdown though. The following code is a giveaway as it is almost identical to that used by my own plugin:

    <script type="text/javascript">
<!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

    February 20, 2008 at 6:56 pm # // Reply

89. 

    DanielRiem says:

    Ryan,

    You must really love your plugin bc you answer everyone’s questions so quickly.

    Thanks so much for the reply about changing sizes. I got that. But I just cant figure out why the plugin works better on ie and not on firefox on my site. i tried about everything and am still dumbfounded. my site is http://www.storiesof.us

    You da man!

    February 20, 2008 at 7:10 pm # // Reply

90. 

    Ryan says:

    DanielRiem – This is the first piece of software I’ve ever made and it’s quite exciting to see that other people find it useful.

    Something weird is happening with your site. I can’t understand why it isn’t working with Firefox. I’ll take a closer look and post back when/if I find a solution for you.

    Nice domain name BTW 🙂

    February 20, 2008 at 9:40 pm # // Reply

91. 

    Ryan says:

    DanielRiem – Firefox Web Developer toolbar to the rescue! I used the outline block elements option in it which outlined your #content block which is obscuring part of the menu. The #content block is transparent, so you can’t actually see it, but since it is overlapping the menu then it blocks the mouseover effect.

    The problem is related to the use of relative positioning in the theme. I usually recommend using floats to avoid these types of issues. Your sidebar is floated rather than using relative positioning hence the menu isn’t suffering this problem on the left hand side.

    If you replace #content in your style.css file with the following, the problem should be cured.
    #content {
width:600px;
margin:0 0 20px 0;
float:left;
padding:10px 18px 15px 18px;
text-align:justify;
}
    If that doesn’t do the trick, then let me know and I’ll take a second look.

    February 20, 2008 at 9:56 pm # // Reply

92. 

    Ryan says:

    I’ve now released a Beta for Version 1.1 which features an options panel for editing the look of the dropdown. It is available here …
    Suckerfish Plugin Version 1.1 Beta

    February 20, 2008 at 10:00 pm # // Reply

93. 

    Ryan says:

    Leo emailed me with a link to his own site which uses the plugin he originally linked to. It seems that the demo site uses a similar method to that used here, but ironically the plugin does not!

    The plugin does indeed use the CSSPlay style method of creating the dropdown. I don’t intend to use this method myself as I prefer the suckerfish approach, but it is interesting to see that someone has created a plugin for this purpose.

    Here is Leo’s demo site … http://www.dingo-style.com/

    And in case you missed it, here is a link to the plugin … http://www.thanhsiang.org/faqing/node/58#comment-353

    February 20, 2008 at 10:51 pm # // Reply

94. 

    Oleksiy says:

    Ryan,
    I am trying to install a new blog for my wife and have troubles to connect your plug in even default theme. When I use I am just getting black page. However when I use I can see categories. I am not a developer but suspect that some reason function was not called properly. Can you please comment this ? Thank you

    February 21, 2008 at 8:55 am # // Reply

95. 

    Adrian Balan says:

    I’m using this plugin on my website(www.pozne.ro). I want to know how I can make the sub-menus to be horizontal ?

    February 21, 2008 at 3:20 pm # // Reply

96. 

    Ryan says:

    Adrian – I haven’t tried, but I think if you increase the width of the dropdown, the menu items should (in theory) appear side by side underneath the section it is dropping down from. You can alter this by changing the suckerfish.css file which came with the plugin.

    I may look at introducing this functionality later, but at this stage I’m concentrating on making sure it can do the basic dropdown functionality as well as possible.

    February 21, 2008 at 4:05 pm # // Reply

97. 

    Ryan says:

    Oleksiy – I tried to visit your site but it wasn’t working. I wasn’t sure if this was the site you are having trouble with either.

    I haven’t heard any reports of a function being called wrong until now, so I’m assuming there is another problem you have come across. If not, I would love to hear confirmation so I can figure out a fix for it.

    A link to the site in question would be very useful.

    February 21, 2008 at 4:08 pm # // Reply

98. 

    Kevin says:

    Hi Ryan

    I have installed your drop down menu files and it’s woking ok.

    However, I seem to be getting a double space menu bat when it drops down.

    http://www.nlcprojects.com/church

    Maybe you could take a look and advise accordingly?

    Thanks

    Kevin

    February 21, 2008 at 8:52 pm # // Reply

99. 

    Ryan says:

    Kevin – I released a beta version of my plugin today which may correct your problem. I suggest trying that and see if it fixes your problem. If not, then leave a comment on my blog and I’ll see if I can find another solution for you.

    The beta of Version 1.1.2 of the plug is available here … https://ryan.hellyer.kiwi/2008/02/20/suckerfish-plugin-11-beta/

    If you don’t want to use the untested beta version, then you could copy the CSS file from the new plugin and replace the CSS file from the old one and it should (I think) correct your problem.

    February 21, 2008 at 8:52 pm # // Reply

100. 

     Kevin says:

     Hi Ryan – thanks for getting back to me

     I tried installing the beta version, but got a mysql error which wiped out everything but my header graphic!

     Forynuately I backed the existing plugin up as I made some changes to the colours etc to macth the header light grey.

     I then tried copying the css file over as suggested, that corrected the size of the text OK, but didn’t correct
     the error on the actual drop down – it’s a visual error in my opinion.

     Kevin

     February 21, 2008 at 8:53 pm # // Reply

101. 

     Ryan says:

     Woops, it seems I made two major errors with the beta version. They are fixed now.

     I’ve taken a quick look at your themes style sheet and all you need to do is remove the following code from your style.css file in your theme and the problem should be solved:

     #navigation li a:hover {
background-color: #d2d2d2;
color: #000;
}

     Let me know if that doesn’t do the trick and I’ll take another look.

     February 21, 2008 at 8:54 pm # // Reply

102. 

     Kevin says:

     Bingo! Thanks Ryan – that’s worked . . . will your beta change the height of the menus?

     Thanks again

     kevin

     February 21, 2008 at 9:14 pm # // Reply

103. 

     Ryan says:

     Kevin – Good to hear your problem is fixed.

     No the beta version of the plugin does not control the height of the menus. You can alter that by editing the suckerfish.css file which comes with the plugin by hand.

     February 21, 2008 at 9:16 pm # // Reply

104. 

     Kevin says:

     Hi Ryan

     Thinking about the height of the menus – logically, it cannot be Suckerfish to blame . . .
     It must be in the theme somewhere.

     I’ll check it out – I guess it will be labelled navigation or something.

     I will be in touch

     Kevin

     February 21, 2008 at 11:19 pm # // Reply

105. 

     Ryan says:

     Kevin – Do you want the main menu items to have the same styling as the dropdown in my demo does? If so, just remove all of the #navigation styling from your themes style.css file. That should fix it. I assumed you wanted to keep that styling, hence I didn’t suggest you correct it last time.

     February 21, 2008 at 11:21 pm # // Reply

106. 

     Oleksiy says:

     Ryan – Thank you for response. It was user error. 😉 Everything works perfectly fine. Started to build template. Will share with you my results. thank you again. Great plug in

     February 22, 2008 at 1:34 pm # // Reply

107. 

     Ryan says:

     I’ve now released a theme which features a Suckerfish Dropdown menu. It does not use this plugin, as the dropdown is hard coded into the template files … https://ryan.hellyer.kiwi/2008/02/23/aqua-vaccinium-wordpress-theme/

     All questions related to this new theme should be posted in the themes blog post.

     February 23, 2008 at 12:04 pm # // Reply

108. 

     Kel says:

     Two problems.

     1- It brings a gray background behind the buttons and I cannot find where that is in the code. I just want to remove or change the color. Seems easy enough but I cannot figure it out.

     2- The drop down menus hide behind my content in the left and right side bars.

     Please help.

     Thanks

     February 24, 2008 at 9:50 am # // Reply

109. 

     Bill Hobbs says:

     I’m currently building a blog for a lawyer friend, and am trying to use suckerfish, but can’t get the drop down menus to center with the rest of the site.

     http://www.americancourthouse.com

     here is the css:

     #suckerfishnav {background-color:#323232;font-family:verdana,sans-serif;font-weight:bold;font-size:1.2em;}
     #suckerfishnav, #suckerfishnav ul {float:left;list-style:none;line-height:1;padding:0;border:0px solid #000;margin:0 0 1em 0;width:100%;}/*can specify a fixed width here if you want, ie: width:30em;*/
     #suckerfishnav a {display:block;color:#eee;text-decoration:none;padding:0.25em 2em;}/*can specify a fixed width here for each first level button if you want, ie: width:10em; You must also modify the #suckerfishnav li as well*/
     #suckerfishnav li {float:right;padding:0;}/*can specify a fixed width here for each first level button if you want, ie: width:10em; You must also modify the #suckerfishnav a as well*/
     #suckerfishnav li ul {position:absolute;left:-99em;height:auto;width:10em;font-weight:normal;;margin:0;}
     #suckerfishnav li li {padding-right:1em;width:9em;border-top:1px solid #000;}
     #suckerfishnav li li a {padding:0.2em 1em;}
     #suckerfishnav li ul a {width:9em;}
     #suckerfishnav li ul ul {margin:-1.50em 0 0 10em;}
     #suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul {left:-99em;}
     #suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul {left:auto;background-color:#bbb;}
     #suckerfishnav li:hover, #suckerfishnav li.sfhover {background: #81AFD5;}

     I have played with it and can’t get it to center.

     Help!

     February 24, 2008 at 5:30 pm # // Reply

110. 

     Ryan says:

     Bill Hobbs –

     Try changing this:
     #suckerfishnav, #suckerfishnav ul {
float:left;
list-style:none;
line-height:1;
padding:0;
border:0px solid #000;
margin:0 0 1em 0;
width:100%;
}

     to this:
     #suckerfishnav, #suckerfishnav ul {
float:left;
list-style:none;
line-height:1;
padding:0;
border:0px solid #000;
margin:0 auto 1em auto;
width:20em;
}

     That will give the menu a fixed width and center it via the margins. You will need to adjust the width to suit, 20em’s was just a guess.

     It is very important to set the width in em’s, not px’s or pt’s as using anything else will cause the menu to goof when the user changes their text size. Also, make sure you test it in Safari, IE7 and Firefox/Opera as they all have different text widths and what may work in one, may be too skinny for the others.

     February 24, 2008 at 6:18 pm # // Reply

111. 

     Ryan says:

     Kel – for styling the dropdown menu, try the new beta plugin as that should be a lot easier for you to control the design with.

     Try removing position:relative from 1_sidebar in your CSS to fix the dropdown hiding behind the sidebar problem. If that doesn’t work, then post back and I’ll take another look.

     February 24, 2008 at 6:26 pm # // Reply

112. 

     Lisa says:

     Having problems installing the plug-in, whenever i add code, it removes it.
     Not even sure i am putting it in right place, complete web-building novice!
     Is this the right plug-in to add drop down menu to parent group bar, to navigate sub-group pages without having big list at side of page?

     February 25, 2008 at 3:07 pm # // Reply

113. 

     Jason says:

     Ryan,
     I have to start off by saying I am a true ovice with css and php, but i can find code, usually, when I’m told what to look for… Found your drop-down plugin — super sweet by the way — and would like to implement it at prospectinsider.com. Have yet to find the proper spot to place the code, however, and am still wondering whether it will work within my “pages” that I have custom labeled (you can see it below my header image at prospectinsider.com)… I’d like to create drop-down pages for those pages… I’m using the tiga theme. If you find a minute to shed some light for me, I’d appreciate it.

     February 25, 2008 at 11:48 pm # // Reply

114. 

     Ryan says:

     Jason – There’ s probably some code which looks something like the following in your header.php file:

     <div class="menu-bar">
<?php wp-list-pages(); ?>
</div>

     If you replace the <?php wp-list-pages(); ?> with the <?php suckerfish(); ?> the dropdown menu should appear in the correct place I think. If this doesn’t work then send me a link to a test blog and I’ll see what I can do from there.

     February 25, 2008 at 11:51 pm # // Reply

115. 

     Jason says:

     My dummy site, sixtoolers.com, is available for trials and the theme is the same one I’m using at the main site, without the customization, of course.

     Looking at my main site at prospectinsider.com, does it even seem like adding these kinds of funtionalities will work without disturbing the customization of the current menu toolbar?

     Thanks for the help,

     February 25, 2008 at 11:52 pm # // Reply

116. 

     Ryan says:

     Jason – What you need to do, is to edit your header.php file in your theme. Find where it says
     <div class="menu-bar">
     and then find where it says
     </div>
     … after that. Delete everything in between those
     two pieces of text and replace it with
     <?php suckerfish(); ?>
     Then re-upload the header.php file to your web host and make sure the dropdown plugin is activated in your WordPress admin panel. The dropdown should then appear. If it doesn’t look correct, then let me know and I’ll see if I can sort out a bug fix to make it look right.

     If you want to edit the look of the plugin yourself, then try the new Beta plugin instead of the current as you can edit lots of different things with that version, including the font, colour, font size, background colours
     etc. of the dropdown menu.

     February 25, 2008 at 11:55 pm # // Reply

117. 

     Jason says:

     sixtoolers.com

     That’s the result when i followed your instructions…

     Also, not sure what you meant by “re-upload the header.php file” because when I did that all it did was replace the file I just inserted the suckerfish code into with the original header file again…

     Did i read that wrong?

     Sorry for being such a novice…

     February 25, 2008 at 11:55 pm # // Reply

118. 

     Ryan says:

     That is very bizaare! The content which belongs in the head tags has ended up inside your menu instead of the dropdown!

     This must be some sort of bug in the beta version. Leave the code as is, and try installing the original version of the plugin instead. That should work. I’ll have a look to see if I can sort out the bug in the beta in the mean time.

     EDIT: A new version of the beta plugin has been released which corrects this problem.

     February 25, 2008 at 11:59 pm # // Reply

119. 

     Ryan says:

     Lisa – I’m not 100% sure of what you are asking. But take a look at the demo page and you can see what this plugin does.

     The site you have left the link for does not seem to have the plugin activated. If the plugin is uploaded and activated, the plugin code should appear between your head tags which it currently does not.

     Once you have the plugin activated, all you need to do is to add the following code wherever you want the dropdown menu to appear in your template:
     <?php suckerfish(); >

     February 26, 2008 at 12:05 am # // Reply

120. 

     Lisa says:

     Yes sorry thats what i want it to do.

     Have activated plug-in in admin, but when i copy paste the code into header.php, and go to check if its worked, when I look back in header.php its deleted it.

     Have looked at other replies to see exactly where to put it, maybe putting in wrong place?

     February 26, 2008 at 12:28 am # // Reply

121. 

     Ryan says:

     Lisa – Is the URL for your site the same as the link you have been posting with? ie: http://www.montrosecaledoniagolfclub.co.uk/?

     As that site does not appear to have the plugin activated.

     I don’t think you are putting the code in the wrong place, something more bizarre is happening.

     Are you using the template editor in WordPress? I have never used that. It may be editing your code like the regular WordPress post editor does – I’m not sure about that though. Perhaps you should try editing the file on your computer and re-upload it.

     February 26, 2008 at 12:43 am # // Reply

122. 

     Jason says:

     the menu bar mountain…

     sixtoolers.com

     February 26, 2008 at 12:43 am # // Reply

123. 

     Ryan says:

     Jason – The menu-bar class is messing your dropdown up. Try changing:
     <div class="menu-bar">
     to just
     <div>

     That should at least get the dropdown menu working. Although you will lose all the styling which you have applied to your told menu.

     February 26, 2008 at 12:44 am # // Reply

124. 

     Lisa says:

     lol, too complicated for me, its two seperate servers? Golf one is on amber.net, I’m using orange? Your plugin is definately in my list of plug-ins on site and activated?

     Yes trying to edit via wordpress theme editor, could it be theme is not editable?

     Wouldn’t have a clue how to edit file on computer so may have to leave it.

     February 26, 2008 at 1:57 am # // Reply

125. 

     Ryan says:

     Lisa – yes, it may be your theme. I’m busy right now, but I’ll post back with instructions on how I think you can correct that. If the problem is what I think it is, then you may have troubles with lots of other plugins too.

     February 26, 2008 at 9:43 am # // Reply

126. 

     Ron says:

     Ryan, I am trying to modify the SuckerFish WP Plugin to suit my
     website. One of
     the issues I’m having is that I have modified my “widgets.php” file to
     exclude
     certain categories by ID. The SuckerFish code doesn’t utilize the
     modifications
     made. Could you please point me in the right direction as to how I can
     get this
     to work? Any help is greatly appreciated.

     Keep up the great work Ryan.

     February 26, 2008 at 9:12 pm # // Reply

127. 

     Ryan says:

     Ron – here are the raw codes you need to display the dropdowns without category number 10. You can edit the bit which says &exclude=10 to change which category is excluded from the dropdown and adding (for example) &exclude=3 after the first will remove category 3 as well.

     This is the raw php code, so you don’t need to use the functions with these, ie: this replaces the <?php suckerfish(); ?> code. Each of the codes below are labelled with their corresponding suckerfish function.

     If you have any troubles, the code doesn’t work (I haven’t tested it) or my explanation is confusing then post back here and I’ll see what I can do to help.

     suckerfish()
     
<?php echo '
<ul id="suckerfishnav">
<li><a href="' , bloginfo('url') , '/">Home</a></li>
<li><a href="#">Pages</a>
<ul>' , wp_list_pages('title_li=') , '</ul>
</li>
<li><a href="#">Archives</a>
<ul>' , wp_get_archives() , '</ul>
</li>
<li><a href="#">Categories</a>
<ul>' , wp_list_categories('title_li=&exclude=10') , '</ul>
</li>
<li><a href="#">Blogroll</a>
<ul>' , wp_list_bookmarks('title_li=&categorize=0') , '</ul>
</li>
</ul>';
?>


     suckerfish1()
     
<?php echo '
<ul id="suckerfishnav">' , wp_list_pages('title_li=') , '</ul>';
?>


     suckerfish2()
     
<?php echo '
<ul id="suckerfishnav">
<li><a href="' , bloginfo('url') , '/">Home</a></li>
' , wp_list_pages('title_li=') , '
</ul>';
?>


     suckerfish3()
     
<?php echo '
<ul id="suckerfishnav">
<li><a href="#">Pages</a>
<ul>' , wp_list_pages('title_li=') , '</ul>
</li>
<li><a href="#">Archives</a>
<ul>' , wp_get_archives() , '</ul>
</li>
<li><a href="#">Categories</a>
<ul>' , wp_list_categories('title_li=&exclude=10') , '</ul>
</li>
<li><a href="#">Blogroll</a>
<ul>' , wp_list_bookmarks('title_li=&categorize=0') , '</ul>
</li>
</ul>';
?>


     suckerfish4()
     
<?php echo '
<ul id="suckerfishnav">
' , wp_list_pages('title_li=') , '
<li><a href="#">Archives</a>
<ul>' , wp_get_archives() , '</ul>
</li>
<li><a href="#">Categories</a>
<ul>' , wp_list_categories('title_li=&exclude=10') , '</ul>
</li>
</ul>';
?>


     suckerfish5()
     
<?php echo '
<ul id="suckerfishnav">
<li><a href="' , bloginfo('url') , '/">Home</a></li>
' , wp_list_pages('title_li=') , '
<li><a href="#">Archives</a>
<ul>' , wp_get_archives() , '</ul>
</li>
<li><a href="#">Categories</a>
<ul>' , wp_list_categories('title_li=&exclude=10') , '</ul>
</li>
</ul>';
?>


     February 26, 2008 at 9:28 pm # // Reply

128. 

     Flick says:

     OMG, you actually rock so much! I found out about your plugin via the ‘Paged Comments’ plugin page, and was really excited! I’m using a mangled version of Suckerfish (I mangled it) on my site at the moment, and was thinking hard about what menu system to use next (I love Suckerfish for its simplicity and cross compability, and the fact it works without J-script) and was a little bit stuck since some of the more up-to-date solutions are actually more problematic to troubleshoot. Am glad that this is really something that I could use instead! 🙂 Thanks!

     February 26, 2008 at 11:44 pm # // Reply

129. 

     Andy says:

     Ryan, great plug-in. Many thanks. Is there a way to add a child menu indicator on a parent list item? An arrow or something that indicates a link has a child menu.

     Regards,

     A

     February 27, 2008 at 5:15 am # // Reply

130. 

     Ryan says:

     Flick – glad you like it 🙂

     February 27, 2008 at 10:14 am # // Reply

131. 

     Ryan says:

     Andy – no, I haven’t figured out a way to do that reliably yet. That is on my list of things to do though.

     February 27, 2008 at 10:15 am # // Reply

132. 

     Dan says:

     I like your blog theme. I want to use it on my blog.
     Can you please tell me from where I can download these theme?

     Many thanks

     February 29, 2008 at 3:44 am # // Reply

133. 

     Ryan says:

     Dan – The latest post on this blog would be a good start 😛 https://ryan.hellyer.kiwi/2008/02/26/hellish-simplicity-wordpress-theme/

     February 29, 2008 at 8:40 am # // Reply

134. 

     Dan says:

     Hey Ryan,

     very nice plugin you’ve set up here, however I’m having a bit of trouble with it.

     I’ve had the same problem Jonathan had with the subpages list overlaying the first-level menu, though not with all themes.

     Right now, I’m trying to customize the k2 theme (which does not have this overlaying problem), but I’m faced with another one : while the drop-down menu displays correctly, it vanishes as soon as I leave the page link. I can sometimes manage to “catch” the first subpage, but it is impossible to select the other subpages.

     This happens with both Safari and Firefox 2.0.0.12 on MacOS 10.5.2, and IE6 on Windows XP.

     I’d be grateful for any suggestion that could fix the problem, as I’m dead set on the idea of pull-down menus 🙂

     February 29, 2008 at 9:24 am # // Reply

135. 

     Ryan says:

     Second Dan – I think the problems you are facing are probably caused by you applying two UL’s to the same list. This creates invalid code and I’m assuming the first UL is apply styling as well which will be goofing up the plugin.

     At the moment you have this:
     <ul class="menu"><?php suckerfish(); ?></ul>

     But all you need is this:
     <?php suckerfish(); ?>

     Hopefully that does the trick 🙂

     February 29, 2008 at 9:36 am # // Reply

136. 

     Dan says:

     You hit the nail on the head! Thanks a lot, Ryan.

     I really need to get seriously into CSS some time 🙂

     February 29, 2008 at 9:29 pm # // Reply

137. 

     Dan says:

     Gah, I lost it again! Every time I insert any kind of vertical offset above the suckerfish nav bar, the dropdown menus are goofed.

     It’s like the “hover” area gets smaller as the suckerfish bar goes farther away from the top of the page, it’s really weird.

     March 1, 2008 at 5:03 am # // Reply

138. 

     Ryan says:

     Dan – How are you inserting the “vertical offset”?

     Are you perhaps adding a margin-top:50px or something along those lines to the #suckerfishnav, #suckerfishnav ul line in your CSS file? If so, it may be that the margin is being applied to the child ULs and messing up your display accordingly.

     If so, maybe try adding some HTML instead, something like <div style="width:100%;height:50px"></div> should do the trick.

     March 1, 2008 at 10:27 am # // Reply

139. 

     Daniel says:

     It would be great to see an administration panel hiding specific pages from the suckerfish menu as well as selecting a certain level that the menu will go down to so that you don’t have a huge level of submenu’s filling the screen.

     thanks for the great plugin.

     March 1, 2008 at 11:07 pm # // Reply

140. 

     Dan says:

     Nope, I made sure that my changes weren’t made to a parent of the suckerfish styles (even tried adding 100px to the main title).

     On the other hand, I played a bit with the suckerfish css, and I probably messed something there.

     For the time being, I’ll build the site w/o suckerfish, and I might come back to this part later 🙂

     March 2, 2008 at 4:08 am # // Reply

141. 

     Aaron says:

     This is a great plug-in. I have been trying to find a plug-in that functioned correctly for drop downs to no avail till I found yours. Great Job!

     March 2, 2008 at 8:26 am # // Reply

142. 

     Ryan says:

     Dan – if you post a link to your problem site here I may be able to help.

     Daniel – that’s a good idea, I’ll see if I can implement that in the next version.

     March 2, 2008 at 8:56 am # // Reply

143. 

     brit says:

     Thank you so much for this plugin! I have a little question, i just want to display drop down categories ( under one top main), i have tried to modify it on my own but i have only managed to make drop down categories without the main top “categories” which cluttered the navigation bar. Can you please tell me what to remove from the php file to achieve that?Thanks!

     March 3, 2008 at 9:27 am # // Reply

144. 

     Ryan says:

     Brit, try replacing the &lt?php suckerfish(); ?> code in your theme with the following. I think it is what you are trying to achieve, if not then let me know.

     <?php echo '
<ul id="suckerfishnav">
<li><a href="#">Categories</a>
<ul>' , wp_list_categories('title_li=&exclude=10') , '</ul>
</li>
</ul>';
?>

     March 3, 2008 at 10:01 am # // Reply

145. 

     brit says:

     It worked like a charm, thank you! And sorry to annoy you again, if i want to add pages also, what line should i add? I mean in the code you already gave me.
     And one last question, the delay time (seconds before menu disappears) is a bit quick for me, can i change it?
     Thank you!

     March 3, 2008 at 3:31 pm # // Reply

146. 

     Ryan says:

     Brit – The following should do the trick 🙂

     <?php echo '
<ul id="suckerfishnav">
<li><a href="#">Pages</a>
<ul>' , wp_list_pages('title_li=') , '</ul>
</li>
<li><a href="#">Categories</a>
<ul>' , wp_list_categories('title_li=&exclude=10') , '</ul>
</li>
</ul>';
?>

     I would love to see the final product, so feel free to post a link to your site once it’s done! Or leave a message via my Contact Page if you don’t want to post the URL here.

     March 3, 2008 at 5:47 pm # // Reply

147. 

     Mike says:

     can you pleas take a look at my site http://www.slavelake.com
     I am trying to use your plugin with the wordpress default theme I am
     running
     the newest version of wordpress.

     can you please help me the menue is not lining up and the menu is
     messing up
     the side bare

     thanks for the great plugin keep up the great work

     March 3, 2008 at 6:14 pm # // Reply

148. 

     Ryan says:

     Mike – The code for the link you provided looks nothing like the default Kubrick theme. It is also missing a Doctype (required for the plugin to work in most browsers) and is missing the code for the plugin.

     March 3, 2008 at 6:23 pm # // Reply

149. 

     Kevin Russell says:

     Hey Ryan – this seems like a great plugin. However, I’ve tried for hours trying to custom modify the CSS and playing around with the location of the PHP entry – and just can’t get it to display right. I finally did get the ‘hover’ fore-ground text color to display correctly by adding a ‘a:hover’ CSS section with the correct color. But as far as the main problem, I’m 99% sure that the problem is because of our template’s header ‘menu’ constraints and etc. – however I’m not sure how to change it to fix the problem.

     It basically, most of the time, will not display the ‘sub-pages’. The only sub-pages I have right now are under ‘Media’ – which are ‘Audio Sermons’ and ‘Video Sermons’. I’ve got it to semi-work by playing with the location of the PHP and putting it BEFORE the Main Menu section (and the drop-down displays semi-correctly) – but most of the time, when put it between where the normal menu section’s ‘s are, it doesn’t display the sub-page under Media. Also, even when I have got it to display the sub-page, it would not ‘overlap’ the section underneath it (as if it’s something to do with the section’s constraints that it won’t let it drop-down and overlap like 1morechapter’s does above).

     Hopefully this is fairly clear. I can correspond via email too if it’s easier – and/or instant messenger. Let me know if you can help – as I’d really like to use your plugin. Thanks.

     March 3, 2008 at 7:44 pm # // Reply

150. 

     Ryan says:

     Kevin – I prefer to communicate here on the blog so that others can see the solutions/process to fix such problems.

     The first error I can see is that you have placed the <?php suckerfish(); ?> code inside UL tags. Remove the UL tags and that should fix some problems.

     I’m checking the rest of it now as there seems to be some other problems as well.

     March 3, 2008 at 9:52 pm # // Reply

151. 

     Ryan says:

     Kevin – You are applying some styles via the #menu DIV tag which is surrounding it. Try removing the styles or the DIV and the menu will be able to drop down.

     Then you have another problem as although the menu is then able to drop down, it’s dropping down behind the main content box. Try removing the position:relative from the following in your CSS. Hopefully removing it doesn’t mess your layout up. But it should fix the inability of the menu to hover above the main content.
     .CON {
background: #fff url(images/BGC.gif) repeat-y center;
width: 1000px;
float: left;
position: relative;
padding: 0px}

     Also, I’ve taken a look at your style.css file and I see that you’ve added the suckerfish CSS code to it. That will be quite an awkward way to modify the style of the dropdown as those styles are replaced by the built-in style sheet which comes with the plugin. If you want to modify the CSS of the dropdown, it’s easiest to modify the suckerfish.css file for this reason.

     Plus you have two </body> tags in your HTML, this doesn’t seem to be causing any problems, but would be good idea to fix anyway in case there are some unknown problems associated with doing that. Plus your code won’t validate.

     March 3, 2008 at 10:09 pm # // Reply

152. 

     Ryan says:

     Brit – Sorry, I forgot to reply to you second question!

     The delay time can not be changed. It is instant and I don’t now how to change that. It could probably be controlled by Javascript, but I know next to nothing about Javascript so can’t help sorry.

     I suggest posting a question at http://sitepoint.com/forums/ in their Javascript section. If you do this and find a solution I’d love to hear about it as it is something I’d like to add as an option in future versions of the plugin.

     March 3, 2008 at 10:17 pm # // Reply

153. 

     Ryan says:

     Mike – I saw some incoming WordPress links from myslavelake.com appear in my stats program so took a look. Is this your site perhaps? The link you left in your comment was to slavelake.com which does not look like it was built with WordPress at all.

     If that is your site, then what problem are you having with your sidebar exactly? I couldn’t see any problems when I viewed it with Firefox2.0.

     March 4, 2008 at 1:52 am # // Reply

154. 

     Ryan says:

     Mike – The menu on myslavelake.com looks very nice. I like the addition of transparent menus. I was meaning to get round to figuring out how to do those and your example (I’m assuming that is your site) has been very useful in this regard. I’ve got it working in the last few minutes on my test version of the plugin and will be looking to add that functionality as an option in the next version.

     March 4, 2008 at 2:06 am # // Reply

155. 

     Andy says:

     “Andy – no, I haven’t figured out a way to do that reliably yet. That is on my list of things to do though.”

     If there were a way to set the style of the parent li then you could add a style to cover an li with a child menu. Unfortunately the only way I can think of doing it would be with JS, something I’m trying to avoid. If only CSS allowed us to target the parent……. li ul<li or something….even li+ul would do it if it worked, but the adjacent selector doesn’t seem to stick in this instance.

     March 4, 2008 at 4:45 am # // Reply

156. 

     Kevin Russell says:

     Thanks so much Ryan!

     As you can tell, I know enough to be dangerous with PHP and CSS – however I’ve actually added form fields that then have to process information to things. CSS was throwing me for a loop here though.

     Thanks for spotting all that! I removed the extra body tag (that was me adding that since I saw it missing – not realizing WordPress automatically adds it).

     Also, was finally able to get the menus working! You’re right, I did have to place it before any of the Menu divisions – however I DID have to keep my menu division in because it messed up the layout when I took it out. However, for a workaround (since it left a blank spot), I just made the height 0px in the style sheet for it. 🙂 I’m sure there is a better way to fix it but I’m still learning here.

     And – you got me on the right track on the position: relative removal. Not only did I have to remove it there, but in about 3-4 other spots – including in the Post Header and Post sections of the CSS. Once I did all that, it finally displays OVER everything instead of under – like it’s supposed to.

     Lastly, thanks for the info on your custom CSS (ryans_suckerfish.css). I had used your beta initially – but it wasn’t wanting to let me fix the test (assumed it was overriding with values from the Admin plugin) – so I went back to the original version. Ironically, I had been able to override the values in my main style.css in your beta – but in your original version I reverted to, it apparently gets the info from your ryans..css file instead. Thanks for pointing that out though – because it probably is going to save me a lots of time wondering why some styles might have worked – and some didn’t.

     Thanks again Ryan!

     Kevin

     March 4, 2008 at 8:17 am # // Reply

157. 

     Ryan says:

     Andy – My knowledge of Javascript is abysmal, so if can find a way to do this with Javascript I’m all ears. It’s not something I would include by default, but it may be an option that some users would like. As long as it degraded nicely without javascript it could work quite nicely.

     If you could apply a certain class to the parents, that would be optimal as I can add a style in the CSS which generates the arrow or whatever method people choose to display that the menu item has child items.

     March 4, 2008 at 9:34 am # // Reply

158. 

     Istvan says:

     As I posted some months ago I was testing your plugin and now is live here: http://www.videocalcio.net

     Thanks for this plugin!

     P.S.: I would like to suggest you for your next releases the possibility to add a sort of separator between categories/sub-categories.

     March 4, 2008 at 10:48 am # // Reply

159. 

     Chris says:

     Hello,

     I was wondering if it was possible to use image buttons rather than the standard text the menu is set up with?

     Thanks,
     Chris

     March 5, 2008 at 7:09 am # // Reply

160. 

     Ryan says:

     Chris – yes that is possible. But it would require doing it by hand as there isn’t anyway to automate this. Or at least not without a huge amount of work. So this will not be included in the plugin.

     An easier and usually more preferred route, is to use graphics as a background to the actual menu text. This way your menu is indexable by bots and will resize appropriately on altering your text size.

     An example of this can be seen on my new WordPress theme Aqua Vaccinium.

     March 5, 2008 at 1:18 pm # // Reply

161. 

     Pinto says:

     Hi’
     nice plugin, i have start to translate it into Hebrew works perfect.
     one problem though it’s look bad really bad in explorer
     i left it so you can see it.
     scroll left you will see the menu why? how it can be fix?
     in fire fox i see it perfect.
     Thank,
     Pinto.

     March 6, 2008 at 9:35 pm # // Reply

162. 

     Ryan says:

     Pinto – Is it possible that the right to left text is messing it up? I’ve never tried/thought of doing that before.

     I was about to have a go at fixing it for you, but I see you have removed it. If you would like help getting it to work I’ll need a link to an example of your problem occurring.

     March 7, 2008 at 1:57 am # // Reply

163. 

     Daniel says:

     Hi Ryan

     I need to ask you a question, I would like to know IF it is possible to make the dropdown menues from “scratch” What I mean is that I want to have different names on the dropdowns than the WordPress default, Pages, Catagories, Archive etc etc.

     And below those I want to have my own submenus. Is this possible at all? I have been trying to understand how this works for some weeks now but I have to ask now.

     I would need approx 5 different menues with my own selected “titles” with own selected sub menu items.

     Hope to hear from you soon

     Regards,

     Daniel

     March 7, 2008 at 11:48 am # // Reply

164. 

     Ryan says:

     Daniel – Yep, it’s definitely possible. In fact it’s not particularly difficult either. Below is an example of the code used to generate a menu with Tomato, Capsicum and Cucumber on the top level and Red, Green and Black options under the Tomato dropdown. You can add as many levels of navigation as you want, just make sure you follow the syntax for placing unordered lists (UL) inside the list item (LI) you want the dropdown/flyout to appear inside.

     <ul id="suckerfishnav">
<li><a href="">Tomato</a>
<ul>
<li><a href="">Red</a></li>
<li><a href="">Green</a></li>
<li><a href="">Black</a></li>
</ul>
</li>
<li><a href="">Capsicum</a></li>
<li><a href="">Cucumber</a></li>
</ul>

     If you need any more help, just leave another comment and I’ll see what I can do.

     March 7, 2008 at 12:06 pm # // Reply

165. 

     Eric says:

     Fantastic plugin and great assistance here.

     I have a page-only WP site, functioning as a CMS. Is there a way to make an item on the menu “non-linked”?

     In other words, I’m trying to make sub-pages drop down under a main topic, but there would be no page defined for that main topic.

     For instance, I’d have the word “Stuff” in the navigation bar, but clicking the word “Stuff” would not go anywhere. It would just list the sub pages under “Stuff”.

     I hope this makes sense…. Thanks again.

     March 8, 2008 at 12:36 pm # // Reply

166. 

     Daniel says:

     Hi Ryan

     Thanks for taking your time to write back. Your reply have helped me allot, It took a second to understand where to put the link to the page from that code but now Im “on my way there” I wait for your coming release!

     Have a nice weekend

     My project page is here

     http://www.norstromfiske.se

     Im currently learning how to publish to later use this together with a friend.

     Regards

     Daniel

     March 8, 2008 at 5:07 pm # // Reply

167. 

     Ryan says:

     Daniel – I like the look of your site so far. Perhaps you should try my new beta plugin though so that you can modify it easily to match your site.

     The beta plugin is available here … https://ryan.hellyer.kiwi/2008/02/20/suckerfish-plugin-11-beta/
     And you can generate the CSS for the dropdown here … https://ryan.hellyer.kiwi/dropdowns/

     March 8, 2008 at 5:07 pm # // Reply

168. 

     Ryan says:

     Thanks Eric.

     You can’t make one of the WordPress generated menu items unlinked, but you can achieve the same effect by building the menu yourself from scratch like I showed Daniel below. Then instead of adding a link to the HREF, just leave it blank.

     March 8, 2008 at 5:13 pm # // Reply

169. 

     Eric says:

     Ryan: In (two) words: You Rock!

     Works perfectly using the code you offered for Daniel.

     Thanks a ton.

     Eric

     March 9, 2008 at 3:43 am # // Reply

170. 

     Ryan says:

     Eric – glad to hear it worked for you 🙂

     March 9, 2008 at 10:29 am # // Reply

171. 

     Shane says:

     Gday Ryan,

     Thanks very much for the plugin! After a bit of tweaking, it is working very nicely on my site.

     If you’d like to add it to your list of examples, please feel free to do so!

     http://www.advs.net.au/

     Cheers,

     Shane.

     March 9, 2008 at 5:04 pm # // Reply

172. 

     Ryan says:

     Thanks for the link Shane. I’ll add it right now.

     I notice that you still have some of the original colouring from the default styling showing through in the dropdown. You may find the new dropdown generator useful if you want to iron some of those bugs out.

     March 9, 2008 at 5:56 pm # // Reply

173. 

     Shane says:

     Thanks Ryan.

     For some reason, the sub menu is not aligning correctly in IE.

     Any Ideas?

     March 9, 2008 at 6:21 pm # // Reply

174. 

     Daniel says:

     Hi Ryan

     Thanks, I uploaded the new version and got it to work, but after i used the CSS page of yours it somehow changed my whole layout and even if i disable the plugin and tried your old one it is still gray all over and the font size is not as it should. Also i have noticed that in Firefox the meny looks like it should but in IE the menue is getting cut after the 3rd menu item. I dont understand why this happens, this happens even if i change theme.

     the meny i have put together looks like this incl the “top part”

     <?php suckerfish(); ?>
     <ul id=”suckerfishnav”>
     <script language=”JavaScript” src=”suckerfish_keyboard.js”></script>
     <!–[if lte IE 6]>
     <script language=”JavaScript” src=”suckerfish_ie.js”></script>
     <![endif]–>

     <li><a href=?page_id=18 “”>Välkommen</a>
     <ul>
     <li><a href=?page_id=27 “”>Heikki</a></li>
     <li><a href=?page_id=28 “”>Fiskeskola</a></li>
     </ul>
     </li>

     <li><a href=?page_id=2 “”>Var är gubben</a>
     <ul>
     <li><a href=?page_id=29 “”>Rapporter/Dagstips</a></li>
     <li><a href=?page_id=30 “”>Filkmlipp</a></li>
     <li><a href=?page_id=31 “”>Ljugarsidan</a></li>
     </ul>
     </li>

     <li><a href=?page_id=32 “”>Kontakta mig</a>
     <ul>
     <li><a href=?page_id=33 “”>Just nu kontakt</a></li>
     <li><a href=?page_id=34 “”>Prislista</a></li>
     <li><a href=?page_id=35 “”>Bokning stugor</a></li>
     <li><a href=?page_id=36 “”>Bokning Guidning</a></li>
     <li><a href=?page_id=37 “”>Länkar</a></li>
     </ul>
     </li>

     <li><a href=?page_id=38 “”>Bilder</a>
     <ul>
     <li><a href=?page_id=43 “”>Landskap och djur</a></li>
     <li><a href=?page_id=45 “”>Nostalgi</a></li>
     <li><a href=?page_id=39 “”>Vinter 08</a></li>
     <li><a href=?page_id=44 “”>Natur/Fiske 08</a></li>
     <li><a href=?page_id=45 “”>Arkiv 07</a></li>
     <li><a href=?page_id=6 “”>Video</a></li>
     <li><a href=?page_id=4 “”>Daniels bilder</a></li>
     </ul>
     </li>
     I cant see any errors in the code I have put together and neither understand why it breaks, but I think that the colour and layout of the page have something to do with the break of the menu.

     Sorry for my bad english in trying to explain my problem.

     To clearafy the background shall be white as the default is and the text shall be as default as well.

     Look forward for your comments.

     March 9, 2008 at 7:54 pm # // Reply

175. 

     Ryan says:

     Shane. The following looks very odd:
     #suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul {left:0px;}

     That is normally as -999em or similar.

     The easiest way to fix these problems is to use the CSS generator page though. It should be able to weed out most of the bugs automatically and save the hassle of modifying it by hand.

     March 9, 2008 at 8:00 pm # // Reply

176. 

     Ryan says:

     Daniel – there are lots of problems in the code you have there. I need to go have dinner right now, but I’ll be back in an hour or so to help.

     March 9, 2008 at 8:01 pm # // Reply

177. 

     Ryan says:

     Hi Daniel.

     “even if i disable the plugin and tried your old one it is still gray all over and the font size is not as it should.”

     I don’t think this is caused by the plugin.

     In the code you provided, you are using a whole bunch of code which you don’t need at all.

     The plugin automatically adds the javascript so there is no need to add those to your HTML, I’m assuming you got those from the Dropdown Generator page, but I only posted them there for those who are NOT using the plugin.

     If you are wanting to create your own custom designed menu then literally all you need is the unordered list which you have correct in your above HTML.

     If you still find the menu isn’t look correct then let me know and I’ll see what I can do.

     This has shown up an interesting problem I hadn’t thought of before. If non English language bloggers want to use the plugin, the titles of each dropdown (pages, categories, archives etc.) will be in English. Whereas I should probably be using some sort of WordPress function which will change depending on your language settings. I’ll try to fix that in a future version of the plugin.

     March 9, 2008 at 9:02 pm # // Reply

178. 

     Shane says:

     Ryan,

     I have used the generator and it aligns ok in firefox, however not in IE.

     Any ideas why???

     March 10, 2008 at 12:00 am # // Reply

179. 

     Ryan says:

     Shane – I’m assuming there’s probably something in your themes style sheet which causing problems with the menu. I’m quite busy at the moment, but if I have time tonight I’ll take a look and see if I can find where the bug is.

     Just to confirm: It did look correct in the generator?

     March 10, 2008 at 11:04 am # // Reply

180. 

     Janet says:

     Interesting! I’m really helped. It’s really smart idea.

     March 10, 2008 at 8:51 pm # // Reply

181. 

     Roseba says:

     I’m currently building a website using the menu command for your plugin: php suckerfish(2).

     Unfortunately, the page referencing that, and the other options for the plugin…. well I can’t find it anymore. Either my search is not yielding the results I wanted, or you updated your page.

     Anyway, what I’m trying to do, is to find out how I can continue using this option, only I want to exclude certain pages from the top navigation. (I’m not sure if I have to get a different plugin for that all together.

     Also, the link above for Online CSS generator is not working. It goes to http://dropdowns/

     March 10, 2008 at 11:36 pm # // Reply

182. 

     Ryan says:

     Roseba – thanks for the heads up on the dead link. I’ve fixed it now.

     The latest version of the plugin does not require to use suckerfish2() as you can control that functionality (and a whole lot more) via the admin panel with it. Hence I’ve removed it from this page. The current plugin only uses suckerfish(), however I’ve included support for the old functions to prevent users themes from breaking on upgrading, but some of the new features won’t be available without moving to suckerfish().

     The latest version of the plugin doesn’t allow you to exclude pages from the admin panel anyway though so you will need to replace the function in your theme anyway if you want to do that. The following code will remove pages with ID’s 5 and 3 from the dropdown (edit/add page ID numbers to suit):

     <ul id="suckerfishnav">
<li><a href="<?php bloginfo('url') ?>/">Home</a></li>
<?php wp_list_pages('title_li=exclude=5,3') ?>
</ul>

     The above code will work with both version 1.0.5 (your current version – probably) and 1.6.1 (the latest). If you have any troubles then post back and I’ll see what I can do to help 🙂

     I’d like to include support for excluding specific pages, categories etc. via the admin panel in the future but I’m still trying to figure out the best way to go about doing that. In the mean time, feel free to bug me for custom codes or build the menu up the old fashioned way with HTML as per my advice to Daniel a few comments back.

     March 11, 2008 at 12:51 am # // Reply

183. 

     Brit says:

     I love this newer version, thank you for updating!

     I have a question however. Is this dropdown menu SEO friendly? Is it css based or javascript based? I heard css dropdown menus are ok but javascript menus do not get indexed by search engines.

     Thanks

     March 11, 2008 at 9:24 pm # // Reply

184. 

     Ryan says:

     Brit – The dropdown menu is very SEO friendly. The Son of Suckerfish method which this plugin uses is pretty much the king of SEO friendly dropdown navigation.

     From a search engines perspective, these dropdown menus aren’t terribly dissimilar from the average WordPress sidebar, albeit many sidebars feature heading tags which may offer a little (negligible?) SEO benefits.

     The plugin does use Javascript, but that has no effect on the SEO properties of the menu, as it is only used to trigger the dropdowns in very old browsers like IE6. I also put the Javascript into IE conditional comments so that only those old browsers even need to bother downloading the teeny bit of Javascript that they need.

     I’ve been looking at ways to add more Javascript features to the dropdown this evening, including fancy graphical effects like fading, delays etc. But none of these new features (which would be optional) would have any effect on the SEO friendliness of the menu either as they are simply additions to the existing unordered list which contains the menu options.

     March 11, 2008 at 10:17 pm # // Reply

185. 

     Brit says:

     Thanks for clarifying this, glad to hear!

     Again thank you for making this so easy for us.I really appreciate it and i suggest this plugin to everyone,it rocks!

     March 12, 2008 at 8:22 am # // Reply

186. 

     Andy Turner says:

     Hi Ryan, just to let you know that I’m using your great dropdown menu on our community site at:

     http://shoalhavenheads.net.au

     and if you’d like to put a link up to us it would sure help the traffic!

     I havn’t upgraded to the new version yet – I’m not sure what version I have, downloaded it in Feb this year – any problem with retaining the version I use or is there any security problems?

     I’m a kiwi now living in Aus (from Auckland). Bet you are enjoying living in Dunedin, a great part of the world!

     All the best and thanks for the dropdown menu,
     Andy Turner

     March 12, 2008 at 3:09 pm # // Reply

187. 

     Ryan says:

     Andy Turner – There is no security risk with using the old version, the new just has a whole heap of extra bits. You can just overwrite your existing plugin with the new one though and it should function just the same except you will have a whole bunch more options in the admin panel. Although you would need to transfer the CSS data from the original version over to the new one – it’s entered in via the admin panel.

     You are now the second Kiwi I know of who is using my plugin 🙂

     I will add your link to my list of live examples shortly.

     March 12, 2008 at 3:11 pm # // Reply

188. 

     Ryan says:

     For anyone who is interested, my development blog features some new animated effects which I’m planning to include as an option in the plugin during the next release … Development Blog

     March 12, 2008 at 10:34 pm # // Reply

189. 

     Nicole says:

     Hello Ryan,

     I am using version 1.6.1 of your plugin and have a small problem that I hope you can assist me with. I also apologize if this has been answered before but searched and did not see it.

     I currently have a specific page titled ‘Home’ which is set to be my main front page. I am having trouble figuring out how to set up the menu so that ‘Home’ appears as the first link and though its a bit confusing I’ll try to explain.

     When I go into your plugin options and set menu item #1 to pages it does include the ‘Home’ page in the list of page links but since it lists pages alphabetically it lists the ‘Home’ page second after the page named ‘FAQ’ (for example FAQ | Home | Services ). If I set it up so menu item #1 to ‘Home’ and menu item #2 to pages then I get two listings of the ‘Home’ page link (for example ( Home | FAQ | Home | Services ). What I am trying to set up is just so I can get: Home | Page link | Page link | Etc. Thank you in advance for any help and of course for the awesome plugin!

     March 13, 2008 at 12:00 pm # // Reply

190. 

     Ryan says:

     Nicole – thanks, that is a bug I hadn’t heard about before.

     I’ll fix that in a future release. In the mean time, replace <?php suckerfish(); ?> with the following code:

     
<?php echo '
<ul id="suckerfishnav">
<li><a href="http://domain.com/home/">Home</a></li>
' , wp_list_pages('title_li=&exclude=5') , '
</ul>';
?>


     The domain.com/home/ will need to be changed to whatever your Home URL is and the number of 5 will need to change to whatever the WordPress ID number of your home page is.

     March 13, 2008 at 12:45 pm # // Reply

191. 

     Ryan says:

     Nicole – I had a sudden thought! All you need to do is to not use the home page option at all, and just manipulate the order of the pages via WordPress’s built in page order tool.

     If you edit a page, the page order tool is on the right handside, near the bottom.

     March 13, 2008 at 7:10 pm # // Reply

192. 

     Ryan says:

     A new beta version is available which features the animated dropdowns I mentioned a few comments ago … Dropdown plugin beta

     March 13, 2008 at 9:17 pm # // Reply

193. 

     Nicole says:

     Thank you so much Ryan for the quick replies. I will try your suggestion(s) and see if I can get it to work. I will also check out the new beta you released, its very exciting!

     March 14, 2008 at 4:27 am # // Reply

194. 

     Karynn says:

     I thought I used this plugin in the past and there were several configuration options for what was included in the navigation menu. i.e. some included pages and categories, some only showed pages, others had a link to blog, etc… but I don’t see any options in yours at all — YET the live examples are indeed showing more than just the default shows. Are they all doing hacks like your response to Nicole?? Or am I confusing your plugin with a different one?

     March 14, 2008 at 8:17 am # // Reply

195. 

     westy says:

     Outstanding work – in many ways!

     But… all the .css styling goes away when I change my permalink structure to anything but the default. Any thoughts? I tried calling in the attributes via a separate menus.css file – but that did not have any effect.

     March 14, 2008 at 10:52 am # // Reply

196. 

     westy says:

     I am sorry – it now works by using your awesome .css generator; but I had to call it in via it’s own .css file, not from the suckerfish options panel.

     Please keep up the outstanding work!

     March 14, 2008 at 10:55 am # // Reply

197. 

     Ryan says:

     Karynn – you definitely have the correct plugin. However I assume you are using an older version of the plugin which does not have the options in the admin panel to control what is on the page.

     You can either upgrade to the new plugin, or keep using the old one. The content of the dropdowns can be partially controlled by altering the function used in your theme.

     The old options are:
     suckerfish(); – same as current
     suckerfish1();
suckerfish2();
suckerfish3();
suckerfish4();
suckerfish5();

     March 14, 2008 at 11:53 am # // Reply

198. 

     Ryan says:

     Westy – I don’t understand that at all. The plugin shouldn’t be bothered at all by changing the permalink structure.

     I’ll test it to see, but I’m 99.99999% certain I won’t be able to replicate that problem.

     March 14, 2008 at 11:55 am # // Reply

199. 

     Ryan says:

     Westy – Confirmed. I changed the permalink structure on the demo page and it is still functioning as per normal apart from the permalinks changing.

     I suspect something else has gone wrong, unrelated to your permalinks. If you can prove me wrong please do though!

     March 14, 2008 at 11:57 am # // Reply

200. 

     Bartek says:

     Hey man,

     First of all, fantastic plugin dude! =]
     And secondly, I noticed you’d like to see examples of people using it in a live environment so here’s our blog:

     (link removed)

     Cheers!
     Bartek

     March 15, 2008 at 4:44 am # // Reply

201. 

     DanielRiem says:

     hey ryan. thanks for the plugin. its been a great addition to the site. quick question. i have a flash video at the top of my site. but the drop down menu always hides behind it. any way to fix that?

     thanks dude.

     http://www.storiesof.us

     March 15, 2008 at 4:06 am # // Reply

202. 

     Ryan says:

     DanielRiem – I’ll see what I can do about the hover over flash problem and will be back shortly with news on that front.

     Unrelated issue: You have an improperly closed favicon link between your head tags.

     March 15, 2008 at 5:02 am # // Reply

203. 

     Ryan says:

     DanielRiem – Sorry, but I can’t figure out any way to stop the menu from displaying underneath the flash video. It doesn’t seem to happen with some video players though, so perhaps try another one.

     March 15, 2008 at 5:14 am # // Reply

204. 

     Phil says:

     Quick hack to allow for drop downs to be visable above overlapping div tags.

     Add to either theme stylesheet or suckerfish

     #suckerfishnav li ul { z-index:1}

     Quality plugin keep up the great work.

     March 15, 2008 at 6:47 am # // Reply

205. 

     Ryan says:

     Thanks Phil.

     What exactly is that correcting though? I thought it was going to fix the problem of the dropdowns not displaying over the top of relatively position block elements, but I tried it and it didn’t correct that problem.

     March 15, 2008 at 9:58 am # // Reply

206. 

     Ryan says:

     Bartek – Thanks! Your link has now been added to the list.

     March 15, 2008 at 10:02 am # // Reply

207. 

     Scot says:

     Ryan

     Great plugin…wondering if there is a way to have the pages sorted some way other than alphabetically? Unless I’m wrong, the plugin displays the links vertically in alphabetical order. It would be nice to adjust somehow, perhaps via the page order option in WordPress?

     Thx

     March 15, 2008 at 12:52 pm # // Reply

208. 

     Scot says:

     Ryan

     Wondering if there is a way to display pages vertically other than alphabetically?

     March 15, 2008 at 1:21 pm # // Reply

209. 

     Ryan says:

     Scott – Yep, the built in page order feature in WordPress can control the order of the menu items.

     If this isn’t working for you then let me know and I’ll look into it.

     March 15, 2008 at 2:33 pm # // Reply

210. 

     Paul says:

     Scot – check out sorting options directly through the wordpress tags – http://codex.wordpress.org/Template_Tags/wp_list_pages

     Ryan – Is there any way to have the sub-menu items ( li ul ul etc) appear to the left as opposed to the right? My menu is floating on the right side of my page and I would like the dropdown list’s sub-pages to be visible.

     I understand that the default list sub-element indent is to the right, and Sukerfish depends on the wordpress tags. I tried setting the wp_list_pages depth to -1 and then reversing your css (left:-999em and left:auto) but I don’t really know what I’m doing and was just hoping that there is a way to do this. Perhaps using CSS to override the default-right-indent.

     Any help would be greatly appreciated. I love this plugin!

     Just to note, I am using the 1.02 version for specific reasons.

     Thanks!

     March 15, 2008 at 3:25 pm # // Reply

211. 

     Ryan says:

     Paul – I’m sure that is possible, but the last time I tried I made a big mess of it and gave up.

     I’ll get back to that at another time though and sort out a proper fix for it. It is something I would like to include in the generator at some stage.

     What ‘specific reason’ do you have for using version 1.02? Speed? In theory it will run slightly quicker than the newer one, but the difference should be pretty negligible.

     March 15, 2008 at 5:23 pm # // Reply

212. 

     Jon mathew says:

     Cool green menu buttons!

     i will try this in my blog

     January 1, 2010 at 6:24 pm # // Reply

     • 

       Ryan says:

       Glad you like them Jon 🙂

       January 2, 2010 at 10:20 pm # // Reply

213. 

     nuManaGa says:

     hello. im using wp 2.9. this plugin work 2.9?

     January 15, 2010 at 6:10 pm # // Reply

     • 

       Ryan says:

       Please use our support forum for questions … https://geek.hellyer.kiwi/forum/

       You may want to read the first sentence of the post too:
       Note: This plugin has been superceded by the ‘PixoPoint Menu Plugin‘.

       January 15, 2010 at 8:17 pm # // Reply

214. 

     Pgplamen says:

     use it successfully

     January 18, 2010 at 4:22 pm # // Reply

215. 

     Wize Time says:

     Is there a tutorial which comes with this either written or video?

     March 8, 2010 at 8:06 pm # // Reply

     • 

       Ryan says:

       No. This plugin is very old and serves no purpose anymore so there is no documentation for it.

       Try the PixoPoint Menu plugin instead … https://geek.hellyer.kiwi/products/pixopoint-menu/

       March 11, 2010 at 12:14 am # // Reply

216. 

     erik says:

     hi !
     i just install this plugin
     it’s just the perfect right plugin for me
     however, in my site the drop down menu appear to be behind the “selected featured posts”

     would you mind go take a look at “”test 3″” drop down menu in header ?
     i am not too sure where i can change the order of the layers

     March 13, 2010 at 8:07 am # // Reply

     • 

       Ryan says:

       This is an ancient out of date plugin which we have not supported for a long time. You should install the PixoPoint Menu plugin instead … https://geek.hellyer.kiwi/pixopoint-menu/

       March 13, 2010 at 8:28 am # // Reply

217. 

     erik says:

     thx very much , i will give it a try !
     but thank you for you time seriously !

     March 13, 2010 at 2:22 pm # // Reply

218. 

     Mis-sold Mortgage says:

     Great plugin. Have used it several times on different types of websites. Does anyone know where I can find a multi-column version of this plugin?

     Thanks in advance.

     March 25, 2010 at 7:44 am # // Reply

     • 

       Ryan says:

       Please post questions in our support forum … https://geek.hellyer.kiwi/forum/

       This plugin does not create a menu, it just adds the Suckerfish script to your pages, so you could use it for anything you like, including with “columns”.

       April 1, 2010 at 12:07 am # // Reply

219. 

     fixx says:

     @Ryan: its an issue with flash..not the menu..

     add this to the flash code :

     wmode=”transparent”

     hope it helps

     April 19, 2010 at 1:14 am # // Reply

     • 

       Ryan says:

       I have no idea what that is in reply to, but yeah, putting Flash into transparent mode will help make it appear below a dropdown menu.

       April 19, 2010 at 5:08 am # // Reply

220. 

     LahoriMela says:

     Hi, Well i installed the plugin but its not working. Means no error.

     I am sorry i am noob. Anyone tell me where i have to put this code “”

     Coz i put in heard fileabove the pages

     But not working.

     June 15, 2010 at 6:42 am # // Reply

221. 

     Thomas Miller says:

     Very nice, I’m a big fan of WordPress and it’s great to see new really useful plugins getting released. I’ll download and check it out, looks exactly like what I was looking for for quite a time. So, thanks alot!

     June 15, 2010 at 8:13 am # // Reply

222. 

     Ryan says:

     What part of “Note: This plugin has been superceded by the ‘PixoPoint Menu Plugin‘.” did you guys miss?

     This is an ancient old blog post which has been long out of date. None of it applies anymore.

     For the latest plugin go to https://geek.hellyer.kiwi/products/pixopoint-menu/.

     The Suckerfish plugin now literally just adds a suckerfish script to your site – absolutely nothing else. That makes it useless for most peoples purposes.

     June 15, 2010 at 10:35 pm # // Reply

223. 

     Adib says:

     Urgh, I’m really new at this but I think I’m just going to deactivate it since I don’t get where to post that php code. Tried posting at the header.php but I don’t get what changes I’m supposed to see.

     November 2, 2010 at 11:36 am # // Reply

     • 

       Ryan says:

       This is a very old and unsupported plugin. You should try the PixoPoint Menu plugin instead … https://geek.hellyer.kiwi/products/pixopoint-menu/

       November 14, 2010 at 4:16 am # // Reply

224. 

     steve says:

     so where is this options page?

     July 25, 2011 at 5:31 am # // Reply

     • 

       Ryan says:

       What options page? This plugin does not have one.

       August 8, 2011 at 9:38 pm # // Reply

225. 

     msbhatti says:

     Hi, I just installed the plugin in my website
     http://bollywood.diggwallpapers.com/
     but I can’t see menu. why?

     Thanks for you reply?

     August 6, 2011 at 4:57 am # // Reply

     • 

       Ryan says:

       This plugin no longer creates menus. It’s used for adding a Suckerfish script to a site. As it says at the top of the page, it has been superceded by the PixoPoint Menu plugin, which it sounds like you would be much better off using.

       August 8, 2011 at 9:39 pm # // Reply

226. 

     Jared says:

     Stupid question but what is the list structure for a custom code drop down. Like say I want a drop down menu for “contests” and then list the contests in the drop down. What’s the structure for that?

     Thanks!

     August 28, 2011 at 9:49 am # // Reply

     • 

       Ryan says:

       It’s just an unordered list.

       September 6, 2011 at 11:07 pm # // Reply

227. 

     Ankur says:

     This is a nice post. Really helpful 🙂

     I also got similar info. in http://www.7tech.co.in/wordpress/how-to-add-a-wordpress-drop-down-menu-to-your-wordpress-theme/ which is also good. 😉

     September 22, 2011 at 6:36 am # // Reply

228. 

     sammi says:

     Many Thanks for developing this great plugin. Really it helped me out.

     October 26, 2011 at 5:19 pm # // Reply

229. 

     faltumsg says:

     I just wanted to have css dropdown menu using codes but by luck this have solved my problem

     November 29, 2011 at 8:42 am # // Reply

230. 

     Amrish says:

     I want to add the plugin to show drop down navigation menu to my wordpress blog . I have installed the plugin and added the php code to header to shoe the navigation .But it is showing simple navigation , drop down is not working

     December 22, 2012 at 2:53 am # // Reply

     • 

       Ryan says:

       This plugin is only used for loading the Suckerfish script for adding IE support now. You probably want to use the multi-level navigation plugin instead.

       January 6, 2013 at 9:42 am # // Reply

231. 

     Sanam says:

     Awesome post. My theme lacks a functions.php file. When I created one and uploaded it, it was populated by some functions that I did not recognize. When I added one of the codes you mentioned above, I got an error saying, Headers Already Sent or something like that.

     February 17, 2015 at 11:11 am # // Reply

     • 

       Ryan says:

       Your functions.php will be echo’ing content out. This is probably because you either didn’t open or fail to close the PHP tags in time.

       March 12, 2015 at 8:46 am # // Reply