2014-10-07 116 views
0

我在WordPress網站導航菜單中的WordPress

<header id="header" class="group"> 
    <div class="margin group"> 
    <div id="header-title" class="group"> 
     <?php if (!is_singular() || (is_page() && prima_get_post_meta('_page_title_hide')) || is_page_template('page_blog.php')) : ?> 
     <h1 class="site-title"> 
      <a href="<?php echo home_url(); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a> 
     </h1> 
     <?php else : ?> 
     <div class="site-title"> 
      <a href="<?php echo home_url(); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a> 
     </div> 
     <?php endif; ?> 
     <?php do_action('prima_header_left'); ?> 
     </div> 
     <div id="header-menu" class="group"> 
     <?php wp_nav_menu(array('theme_location' => 'header-menu', 'fallback_cb' => '', 'echo' => true, 'container' => false, 'menu_id' => 'menu-primary', 'menu_class' => 'sf-menu menu-primary')); ?> 
     <?php do_action('prima_header_right'); ?> 
    </div> 
    </div> 
</header> 

有這樣的導航代碼,我所要的輸出是這樣的:

<div id='cssmenu'> 
<ul> 
    <li><a href='#'>Home</a></li> 
    <li class='active has-sub'><a href='#'>Products</a> 
     <ul> 
     <li class='has-sub'><a href='#'>Product 1</a> 
      <ul> 
       <li><a href='#'>Sub Product</a></li> 
       <li><a href='#'>Sub Product</a></li> 
      </ul> 
     </li> 
     <li class='has-sub'><a href='#'>Product 2</a> 
      <ul> 
       <li><a href='#'>Sub Product</a></li> 
       <li><a href='#'>Sub Product</a></li> 
      </ul> 
     </li> 
     </ul> 
    </li> 
    <li class='has-sub'><a href='#'>Products</a> 
     <ul> 
     <li class='has-sub'><a href='#'>Product 1</a> 
      <ul> 
       <li><a href='#'>Sub Product</a></li> 
       <li><a href='#'>Sub Product</a></li> 
      </ul> 
     </li> 
     <li class='has-sub'><a href='#'>Product 2</a> 
      <ul> 
       <li><a href='#'>Sub Product</a></li> 
       <li><a href='#'>Sub Product</a></li> 
      </ul> 
     </li> 
     </ul> 
    </li> 
    <li><a href='#'>About</a></li> 
    <li><a href='#'>Contact</a></li> 
</ul> 
</div> 

如何代碼呢? 我對WordPress編程沒有太多想法。我對「活躍」css類感到困惑,因爲給出的WP代碼沒有一個,但我需要實現它。

+0

通過下面的代碼添加有CSS的'.active'? – 2014-10-07 07:11:26

+0

是的,.active類有一個css動畫 – 2014-10-07 07:12:38

回答

0

嘗試在functions.php

add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2); 
function special_nav_class($classes, $item){ 
    if(in_array('current-menu-item', $classes)){ 
      $classes[] = 'active '; 
    } 
    return $classes; 
}