2013-05-10 89 views
0

我仍然在愚弄这个愚蠢的导航菜单。这个想法是,当你第一次访问页面时,会列出顶级页面,当其中一个页面被点击时,第二级菜单出现在其下面,并显示所有选定页面的子页面,当点击其中一个页面时,所有页面所选二级页面的三级页面显示在二级页面下方。3级WordPress的导航问题

我试图用各种方式来完成这个任务,我甚至试图让一个会话存储来记住一些部分,但是我无法找到一个好的解决方案。

这是我迄今所做的:

<?php 
wp_nav_menu(array(
    'sort_column' => 'menu_order', 
    'theme_location' => 'primary-menu' 
));// Prints the primary top level menu 
$level = count($post->ancestors); 
echo $level;// Just for testing purposes 
if ($post->post_parent){ 
    $children = wp_list_pages("title_li=&child_of=" . $post->post_parent . "&echo=0&depth=1"); 
    $grandchildren = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0'); 
} 
else{ 
    $children = wp_list_pages("title_li=&child_of=" . $post->ID . "&echo=0&depth=1"); 
} 
if ($children) { 
    echo $children; 
} 
if ($grandchildren){ 
    echo $grandchildren; 
} 
?> 

这里是我遇到的问题。它是一种方式,所以如果我点击顶层第二层出现,如果我点击第二层,第三层出现,但是当我点击第三层时,第二层消失。

这让我疯狂!我已经花了一天时间在这现在阅读所有关于get_post get_children等等等等等等

感谢,

Ç

+0

你可以使用jquery mega菜单插件为这个和所有的事情进行得很好 – 2013-05-10 04:02:18

回答

0

这里是我与子菜单和子菜单的子菜单解决方案.. ..等等。

我调用菜单是这样的:

<?php $defaults = array(
'theme_location' => '', 
'menu'   => 'TopMenu', 
'container'  => 'ul', 
'container_class' => 'topmenu-{topmenu slug}-container', 
'container_id' => 'topmenu', 
'menu_class'  => 'topmenu', 
'menu_id'   => 'topmenu-{topmenu slug}[-{increment}]', 
'echo'   => true, 
'fallback_cb'  => 'wp_page_menu', 
'before'   => '', 
'after'   => '', 
'link_before'  => '', 
'link_after'  => '', 
'items_wrap'  => '<ul id="%1$s" class="%2$s">%3$s</ul>', 
'depth'   => 0, 
'walker'   => '' 

); ?>

此菜单使用一个简单的topmenu类。好的,这里是可以根据需要定制的CSS。

.topmenu{ 
    border:none; 
    border:0px; 
    margin:0px; 
    padding:0px 0px 0px 10px; 
    font-family:Arial, serif; 
    font-size:10px; 
    list-style-type:none; 

    } 
.topmenu ul{ 
    height:20px; 
    list-style:none; 
    margin:0; 
    padding:0; 

    } 
.topmenu li{ 
    float:left; 
    padding:0px; 
    list-style-type:none; 

    } 
.topmenu li a{ 
    background-color:#000000; 
    color:#6699CC; 
    display:block; 
    line-height:20px; 
    margin:0px; 
    padding:0px 10px; 
    text-align:center; 
    text-transform:uppercase; 
    letter-spacing:-1px; 
    text-decoration:none; 
    list-style-type:none; 
    border-right:1px solid #666666; 
    } 
    .topmenu li:first-child a { border-left: none; } 
    .topmenu li:last-child a{ 
    padding-right:0; 
    border-right:none; 

    } 

    .topmenu li a:hover { 
    color:#00CCFF; 
    text-decoration:none; 
    list-style-type:none; 
    } 

我希望这会帮助你。

+0

好吧,我会尝试这个,当我回去工作。谢谢! – Charlie 2013-05-10 19:11:19