PreviousPauseNext
Latest Free WordPress Themes | More Free Themes
AdsPress WordPress Theme
AdsPress

WP 2.5 Gallery Compatible
Adsense Ready
Gravatar Ready
2-Columns
Widget-Ready
Logo PSD

Demo
Download
Latest Free WordPress Themes | More Free Themes
Statement WordPress Theme
Statement

WP 2.5 Gallery Compatible
Quick Tabs
100% Width
3-Columns
Widget-Ready
Logo PSD

Demo
Download
Latest Free WordPress Themes | More Free Themes
Tutorials WordPress Theme
Tutorial Theme

Tutorials Feature
Thumbnails
Bright colors
3-Columns
Widget-Ready
XHTML Compliant

Demo
Download
Latest Free WordPress Themes | More Free Themes
Corptheme WordPress Theme
Corptheme

Four Flavors
Dropdown Menu
Separate Trackbacks
3-Columns
Widget-Ready
XHTML Compliant

Demo
Download
Latest Free WordPress Themes | More Free Themes
Chronicles WordPress Theme
Chronicles

Dark Brown
3-Columns
Widget-Ready
XHTML Compliant
Web 2.0

Demo
Download
Latest Free WordPress Themes | More Free Themes
Velocity WordPress Theme
Velocity

Trackbacks & Comments
3-Columns
Widget Ready
XHTML Compliant
Web 2.0

Demo
Download
Latest Free WordPress Themes | More Free Themes
Blue Lily Theme
Blue Lily

3-Column
Widget Ready
XHTML Compliant
Web 2.0
Rounded Edges

Demo
Download
Latest Free WordPress Themes | More Free Themes
Techicon Theme
Techicon

4-Column
Widget Ready
XHTML Compliant
Blue/White
Recent Boxes

Demo
Download
Latest Free WordPress Themes | More Free Themes
Brilliance Theme
Brilliance

3-Column
Widget Ready
XHTML Compliant
Black/White
Adsense Ready

Demo
Download
Latest Free WordPress Themes | More Free Themes
Identity Theme
Identity

3-Column
Widget Ready
XHTML Compliant
Black/White
Rounded Edges

Demo
Download
Latest Free WordPress Themes | More Free Themes
Xplosive Reloaded Theme
Xplosive Reloaded

3-Column
Widget Ready
XHTML Compliant
Multi-colored
CSS Style Switcher

Demo
Download
Latest Free WordPress Themes | More Free Themes
Limit Theme
Limit

3-Column
Widget Ready
XHTML Compliant
Blue/White
Rounded Edges

Demo
Download

How to Add a Drop Down Menu to your Theme

Written by Jai on April 2, 2008 – 4:32 pm - 2,195 views

Add Drop Down Menu to WordPress theme

A lot of people wanted to know the technique for adding a Drop Down Menu to their WordPress themes. So, here is a quick way to do this. This tweak will let you create menus, sub-menus and sub-sub-menus and it applies to your pages, categories and archives.

Step 1

Download the Suckerfish Dropdown Menu for WordPress. Even if you have installed WordPress 2.5 recently, this plugin works perfectly. Extract the plugin and put the files in your wp-content/plugins folder. Activate the plugin from your wp-admin section.

Step 2

Now, open your existing theme folder which you have applied to your WordPress installation. Most probably, you already have a navigation menu in the theme (most themes have it in the header.php file). So, just replace your existing menu code with this command :-

<?php suckerfish(); ?>

Save and close the file.

Step 3

This is the final step. Go to this online Suckerfish Dropdown CSS Generator, where you can generate a custom CSS file for your menu and copy it to your clipboard. Now go to your wp-admin and click on the Suckerfish option which you can find under the options menu (in WP 2.3) or the settings menu (WP 2.5). Paste the custom CSS information where it says “Enter your CSS here”. It might show something like #222 in the box which you can safely remove. The plugin also gives you options to choose the menu items that you want to display in the menu.

To test the functionality of this drop down menu, go ahead and make some pages and sub-pages. Preview your theme and it should work flawlessly. Let me know if you have any questions. Good luck!

If you enjoyed this post, make sure you subscribe to my RSS feed!


9 Responses to “How to Add a Drop Down Menu to your Theme”



  1. thnx for this tips



  2. Hi,
    Thanks for the post about my plugin and generator page :)

    I need to fix that #222 problem. It’s meant to enter a standard looking CSS intially, but for some reason I forgot to add that and didn’t realise till recently.

    I also have a beta version of the plugin which has some extra features … Beta Dropdown plugin



  3. It is awesome tips..i already download and will try it out.



  4. It’s a good ways.tks



  5. This is what i want,thanks for your guide.



  6. Any tips how to install this into Semiologic custom.php file?

    Thanks :)



  7. Hi Jai,

    I struggled with it for about 4 hours last night and couldn’t sort out how to add Suckerfish to your Chronicles theme. This is the last piece I need to move my site to that theme permanently (or at least for a long time). Any suggestions? Thanks in advance for the help!

    If this can be accomplished, I’ll be hitting that PayPal donate button.

    Bob

    P.S. With a little Wordpress.org forums help I was able to get the graphic into the right place at the top right of the website.



  8. Here there a way to make a menu for the side navigation bars on WP?

  1. 1 Trackback(s)

  2. [6] ???? ??????? ? ?????????

Post a Comment

BobV3 - A Premium WordPress Theme - $89.99
Modblogger - A Premium WordPress Theme - $89.99
Trueblogger - A Premium WordPress Theme - $79.99
Moneyblogger - A Premium WordPress Theme - $49.99
You can now make money by selling these premium themes. Earn a whopping 33% commission on every sale that you make from your website.
Join our Affiliate Program!