WP Pro - Web Design, Development & Pro WordPress Hosting for Serious Bloggers


Anatomy of a Magazine Style Premium WordPress Theme – Part 3.1 “Navigation – Second Level Menu”


If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!

Magazine style themes overcome this limitation (or at least they should if they are charging you money) by using one or more of the following:

  • Second level navigation
  • Conditional menus
  • Intelligent dropdown/slidedown menus

news wp magazine style themeA good example of a magazine style themes using second level navigation to include category pages is WP Magazine and both archives and categories as dropdowns is Solostream 3. Both the themes are designed by Solostream.

An example of a magazine style theme using conditional menus is my own semi-magazine style theme Black+White, see the demo and click on either [Support] or [Archive] and a Submenu will show up in the navigation bar to the right.

The third and the most sort after navigation style is the intelligent dropdown or more appropriately “slidedown” menu using CSS and JavaScript (for IE). Examples include News by Bence Kucsan and the very popular Revolution by Brian Gardner.

There is no one method that is better than the other, it’s a matter of personal preference and site specific needs.

How do we add these Functions to our Existing Designs?

Since our tutorials are running longer than expected, we will focus on just the “second level” menu in this section.

13 Responses to “Anatomy of a Magazine Style Premium WordPress Theme – Part 3.1 “Navigation – Second Level Menu””

  1. Awesome! I’ve never really been that technically-oriented, but you’re breaking down how these themes are made makes it so much easier to digest, thanks so much!

  2. @ CleverSage

    Thank you. I am glad I could be of some use :-)

  3. Is it easy to customize the header on this theme w/ an image? I love it, but would like to plug in a logo instead of the text. Great work!

  4. Also – I notice that the posts are short and then say “Read More.” Does it only display a certain number of characters and then readers will need to click? Is that an option that can be turned off so that the entire post can be displayed?

  5. I love how you provide some code and explain the variations.

    For instance, the navigation in the header and the template ttag and code your provided.

  6. I have seen pirated copies of the revolution theme going around somewhere. It was not you who designed it, was it?

  7. @ seo

    That is below the belt, just because I can do something does not mean I will rip someone off. You must be either kidding or stupid, you pick :-)

  8. @ seo

    Revolution is by Brian Gardner, I am sure he is aware of the rips, it happens to all designers and I have my share of it on almost a weekly basis when I find someone is using my theme with their credits and worse hard coded adware.

  9. Oh no, you misunderstood me. I was just warning you someone is stealing your templates just in case you were the original designer of that theme. I was not accusing you of doing this :)

  10. brilliant. So simple and easy, and explained well. So, I expect the conditional explanation involves how to target related pages? Looking forward to more.


Trackbacks

  1. Anatomy of a Magazine Style Premium WordPress Theme - Part 3.2 “Conditional Navigation Menus” // Headsetoptions.org
  2. When To Use Magazine-Style Themes For Blogs? | [w3b]ndesign
  3. Anatomy of a Magazine Style Premium WordPress Theme - Part 3.2 “Conditional Navigation Menus” » WP Pro - Web Design, Development & Pro WordPress Hosting for Serious Bloggers

Leave a Response

Some Useful Info

Use SimpleCode while including codes.

The links from all comments have the no-follow tag to prevent spammers from gaming their way up into SERP. So please keep the comments clean, try not to use keywords as "Names" or post unnecessary links in the comments. Thank you for cooperating.



Copyright © WP Pro - CSS | XHTML | Login | Return to Top ↑