Creating a Custom Dropdown Menu in WordPress

How would you like to have a nicely organized, customized, hierarchy-style menu in your blog? It’s super easy to do.

For starters, login to WordPress and make sure that you have applied any and all appropriate tags and labels to your posts.

Secondly, make sure that your theme will accept a custom menu. (See “Theme Locations” in the top left corner of the Menus screen.)

When you’re good to go on both those counts, we’ll add the menu.

  1. From your main sidebar, go to Appearance > Menus.
  2. At the top, click “Screen Options”.

    Screen options for the Menus screen in WordPress.

    Click the Screen Options tab.

  3. Make sure that you’ve checked “Posts”, “Categories”, “Post Tags”, whatever you’ll want to have included in your menu.
  4. Give your Menu a name.
  5. In “URL” under “Custom Links”, change the “http://” to “#“.

    Create a custom menu tab using the custom links box in WordPress.

    Delete what's in the URL box, type a # sign, and click Add to Menu.

  6. Click “Add to Menu”. This gives you a non-linked tab/button on your menu.
  7. Check the boxes in “Posts”, “Pages”, “Categories”, etc to choose what to add to your menu.
  8. In the main box, drag and drop everything into the order you want it to appear.
  9. To form a drop-down menu, drag your sub-topics below your custom links.
  10. When you drop the sub-topics into place, shift them a little to the right (see placement in the image above).
  11. To create a sub-sub-topic, place it below your sub-topic and shift it to the right a little further.
  12. When you’re done, click “Save Menu”.

In the image above, “General Techie” is a custom link that appears as a tab/button on my menu. When you click “General Techie”, it does nothing. However, below it are “Reviews”, “Troubleshooting and Help” and “Stuff to Avoid”. These are all my sub-topics.

If I wanted to give “Stuff to Avoid” its own sub-topics of “Scams” and “Viruses”, I’d add those tags to my menu, move them below “Stuff to Avoid” and drop them below and slightly right of “Stuff to Avoid”.

When you’ve finished arranging everything and saving, view your page again. If your new menu doesn’t show up, make sure you’ve got it set to show up. In the top-left corner of the “Menus” screen, you’ll see “Theme Locations”. Choose your new menu and click “Save”.

If you update your existing tags, categories, etc a lot, be sure to update your menu accordingly. Otherwise, you’ll wind up with unclickable menu items that do nothing.

Happy Blogscapades!

This entry was posted in Blogging, Intermediate and tagged , , . Bookmark the permalink.

Tell Me What You Think

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s