Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Multi-tiered menu just like this: http://www.stylepark.com/ WordPress

  • SOLVED

Hello,

I would like to create a menu in my website that would work exactly like the main menu of this website: http://www.stylepark.com/

For example:

Imagine that DESIGN is a wordpress category of my site. So you click on DESIGN link and it shows all posts of 'DESIGN' category (with the 'CATEGORIE' subcategory checked )

So you want to see just design>category>lighting ... Then you click on the 'LIGHTING' link (where Lighting is a subcategory of Category)

Is it clear? The menu should work exactly like the stylepark menu.


thanks!

Answers (3)

2011-06-12

Christianto answers:

Hi Thiago maia,

please try this jQuery script, below code will only show first child of category like http://www.stylepark.com/ when user click/go to certain category.

put below code on your functions.php

function menu_hide_js(){ ?>
<script type="text/javascript" charset="utf-8">
jQuery(document).ready(function($){
$('.sub-menu').css({display:'none'});
$('.current-menu-item > .sub-menu').css({display:'block'});
$('.current-menu-item').parents('.sub-menu').css({display:'block'});
});
</script>
<?php }
add_action('wp_footer','menu_hide_js');

after you put the code, create the menu as usual. You have to adjust the css, since you didn't provide the site url, I can't see your menu style.

Let me know if this works on your site..

Thanks,
Christianto


Christianto comments:

Any result Thiago maia?


thiago maia comments:

hello christiano!

i put the code in the functions.php but it didn't work...

my page is blocked, so you have to login:

http://www.materiabrasil.net/wp-admin

login: demo
password: materiademo

maybe i am doing anything wrong... if you want i can give you the permission to be an administrator.

cheers


Christianto comments:

I guess your theme didn't have run wp_footer() so the script didn't loaded..
PM me your admin panel account..
I will check it..


Christianto comments:

Hi Thiago maia,

You are using superfish dropdown for the menu, this is why it won't work..
If you see on stylepark.com, it didn't use any dropdown function..

Did you wish to remove the dropdown?


thiago maia comments:

for sure christianto!

i want to remove the dropdown :)

can you do it?


Christianto comments:

Hi Thiago maia,

I add the menu like on stylepark.com, Sorry it took so long, I found difficulties because the way wordpress show its menu and stylepark.com are totally different.

So my ordinary function won't work, and should be recreated from scratch..

Please vote me..

Thanks

2011-06-11

Joe Jenkins answers:

I use UberMenu on all my sites, as it is capable of creating great menus & using the WordPress 3 menu system:

http://bit.ly/lkaOI2


thiago maia comments:

thank you joe jenkins!

the plugin is very nice. i don't know if i am wrong. but it seems that, if I click on a parent item, it shows the sub-menu, but don't take me to any page, right? it only takes me to a page when I click in a sub-menu item.

In the Stylepark's case, if you click on 'MATERIAL', for example, it gets me to the 'Material > Categories' page and it shows the third level menu (plastic, rubber, etc, ).

That is exactly what i am looking for:

When I click in a First level item (in this case 'Material'), it gets me to the Second Level page that I selected as the main item of second level (in this case they choose to go to the 'Categories'), and then shows the third level menu)...

Is it clear? sorry for some english mistakes :)

cheers

thiago maia


Joe Jenkins comments:

Ubermenu uses the WordPress 3 menu system, so if you want it to link, you can just add the link in there.

The developers are also very helpful, so they can help with any problems you may come across.


thiago maia comments:

thanks joe. i thin that i am going try it later.

cheers!

2011-06-11

Pali Madra answers:

Hello

I think your solution can be tackled by using Jquery using the code as explained at http://codepolice.net/2010/06/28/only-show-the-sub-menu-when-the-parent-is-selected-with-the-new-wp_nav_menu-in-wordpress-3-0/.

Let me know if you need help still.


Cheers
Pali Madra


thiago maia comments:

Hello Pali,

I must admit that I am a really really beginner in programming. I am trying to do everything by my one, and I have reached some results. But regarding to this topic (the menu), I am not able to do it. I have read all the topics in the link that you sent to me, and it seems that it fits my needs. But I can't go trought it without help. I tried some things but they didn't work well.

Is there any way that you can help me with this issue? I don't know it this is usual, but I could give you acces for the admin area, for example. It would be a nice way for learning if you could make it, and then I could see and discover how did you do it.

Thank you!

(sorry for some english mistakes :) )

cheers,
thiago maia