Navigation menu is a really important part of a website, both visually and functionally. Though, I noticed that most blogs use a really simple navigation menu. A simple menu can be good sometimes, but if you’re looking for something more sophisticated, I’m pretty sure you’re going to enjoy this list.
Here’s 5 really cool tutorials to help you create a stunning navigation for your Wordpress blog.

Creating Two-Tiered Conditional Navigation in Wordpress


Which WordPress user doesn’t know Darren Hoyt, the creator the free magazine theme Mimbo Magazine ? In this great tutorial, Darren explains how to create a professional two-tiered navigation menu.
? Source

How To: Making a Categories Drop-Down Menu


This was my first post on Hack Wordpress, and seems like you guys enjoyed it. In this tutorial, I explain how to create a navigation bar with a category drop-drown menu.
? Source

Adding a navigation bar to the default kubrick theme


The default “Kubrick” theme is probably the most used Wordpress theme. Though, I think it should be better with a navigation bar. Hopefullt, this tutorial is here to help!
? Source

Wordpress: “Magazine style” Horizontal dropdown menu


One of my last tutorials, published on my blog CatsWhoCode. This how-to explain how you can create an horizontal dropdown menu.

@rarr; Source

Using Sliding Doors with Wordpress Navigation


This sliding doors CSS hack allows you to create sophisticated tabs for your navigation bar. Sadly, Wordpress core functions wp_list_pages() and wp_list_categories() don’t allow you to add the required span tag to use this technique.
This tutorial will show you how to bypass this limitation by using a hack, and then you’ll be ready to enjoy sliding-doors for your Wordpress navigation!

? Source

Any other navigation tutorial that should be in the list? Leave us a comment below!

Want automatic updates? Subscribe to our RSS feed or
Get Email Updates sent directly to your inbox!
Digg This | Stumble it | Add to Del.icio.us | | Print This

There Are 19 Responses So Far. »

  1. 1 PJ
    Friday, August 29th, 2008 at 6:56 am

    Nice list of tutorials, to which you could add the scrollover integration tutorial given at wpcandy.

  2. 2 Frank Gil
    Monday, September 1st, 2008 at 1:06 pm

    hey I will try to use the slide door style, seems really nice, thanks for sharing!

  3. 3 jbj
    Tuesday, September 2nd, 2008 at 11:13 am

    You’re welcome guys, I’m glad you enjoyed this post :)

  4. 4 freeocean
    Tuesday, September 2nd, 2008 at 9:25 pm

    I was learning templates, these elements is necessary,I hope that through learning, can make such a pretty navigation!

  5. 5 Kyle Eslick
    Thursday, September 4th, 2008 at 10:57 am

    Great list! I love these types of posts.

    Thanks for contributing this post JBJ!

  6. 6 CocoaDiva
    Monday, September 15th, 2008 at 10:12 pm

    How do I prevent my horizontal menu from showing up in all my google posts. When google looks at my individual posts it doesn’t even get to the content. All of my posts show up with the description of my blog and then the categories in the menu. Please help because my blog is indexed incorrectly!

  7. 7 jbj
    Tuesday, September 23rd, 2008 at 3:45 pm

    @Kyle: Thanks! I’m glad to contribute to HWP.

    @CocoaDiva: I’m pretty sure the problem is the prototype.js library which is linked just after your menu…Link it on the <head> part of your header.php file, and your site will load correctly.

  8. 8 Jake
    Sunday, October 26th, 2008 at 7:33 am

    Hi!

    I am having dramas with the menu. When I hover on a Top menu the sub menu will display but hidden under the smooth gallery photos. It there a CSS coding that will overcome this at all.

    Please follow this link for a screen shot at what I’m talking about.

    http://www.epsilonfoundation.com.au/menu.jpg

  9. 9 teraOm
    Tuesday, November 4th, 2008 at 1:05 pm

    Thanks, a two tier navigation is quite difficult to implement and this tutorial could have been a bit more elaborate.

  10. 10 Addy
    Sunday, November 30th, 2008 at 10:01 pm

    very usefull.. thank :)



Leave A Comment