See the Admin layout (wireframe) below.

Header - Logo and Logout Link

Main navigation - Orders, Members, Shops, etc.

Sub-Navigation - List of links that is related to Main navigation. Eg: If you were on the "Members" page, you would see something like 'List Members', 'Add Members', 'Bans List Members' on the Sub-Navigation

enter image description here

If you click on the 'Shops' link from the Main navigation, you will then see a list of shops name. If you click on "Shops One" link then it will show all the information about "Shops One" and the settings... Edit Profile, Invoices and Product are the tabs.

On the "Product" tab, I am trying to figure out how to put a list of Categories (links) there and it must be vertical.

Next to the categories links, it will be list of products.

The problem is there is not enough room in the tab box.

Any suggestion?

Edit: Redesigned Wireframe, see below:

List of Shops

enter image description here

Next Page - When you click on Shop One from the list

enter image description here

  • What is the purpose of Categories? Is it a filter? Are there any other controls with the similar purpose?
    – dnbrv
    Feb 19, 2012 at 2:27
  • @dnbrv List of Category with the related products. Eg: Books => PHP, MySQL, HTML, etc. 'Products' tab is where I can add products and the category. Feb 19, 2012 at 2:34
  • Prior to selecting a category, does the tab list all products? Are there any other controls for products?
    – dnbrv
    Feb 19, 2012 at 2:59
  • @dnbrv products will only be listed when clicking on the category link - via Ajax. So therefor it stay on the same page and the tab. Feb 19, 2012 at 3:06

2 Answers 2


The problem is that you have four levels of navigation and you're going to fit in a fifth level, and you use a separate control for each one. You need to combine at least two levels, and it will look much simpler.

If I understand correctly, all top-level nav items have a sub-level (the vertical menu on the left), but not all sub-levels have a third and fourth level (the list of shops - shop1, shop2 etc and the tabs for each shop). The second level can be a submenu of the top level, and then you display the 3rd level in a vertical menu just for the items that require it.

You could also combine the 3rd and 4th level in the vertical list, but since the 4th level (the tabs for each shop) is the same for all items, it wouldn't make much sense.

enter image description here

  • That is a good idea thanks. I have copied your concept a bit. See my updated question, I have included more wireframe pictures. What do you think? Feb 19, 2012 at 12:51
  • @user791022 Structurally I think it works much better now (if the 2nd level is not permanently visible), but tabs within tabs never look good, especially when it's vertical tabs within a horizontal tab. If you change it to a simple master-detail, just a list on the left with a selected item detailed on the right (like in my WF), it will look much better. Feb 21, 2012 at 6:36

The relationship of products to shops typically isn't many to one or vice versa — typically you don't have each location just carrying unique products to itself; there are some overlaps. I'd make products its own section on your main navigation for adding and managing them.

My guess is that third tab shouldn't be "products" but "inventory" where you can search (being the keyword) for products at that location and possibly update the amount in stock.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.