Question

我有一个主导航，所有父母都有孩子。例如：

Page A: About Us
child1
child2

Page B : Our services
Child 3
Child 4

我需要在页面上包含一个水平子菜单。但我的问题是，如果目前我们在页面A上，页面A的所有子项目只显示在页面上。如果我们在页面A上，它应该看起来像：

Page A
Child 1
Child 2

像这样，当我们转到页面B时，只显示页面B的孩子。

      <?php 
  $args = array(
   'theme_location'  => '',
   'menu'            => '13',  //nav menu id, which has about-us as a menu.
   'container'       => 'div',
   'container_class' => '',
   'container_id'    => '',
   'menu_class'      => 'menu',
   'menu_id'         => '',
   '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'          => ''
);
  $menu_items = wp_nav_menu($args);//wp_get_nav_menu_items(13);

我尝试编写上面的代码，这导致所有父项都带有他们的孩子。

有人可以帮我吗？

简而言之，我希望得到关于我们菜单项的所有孩子（子菜单）。（即我希望child1＆amp; child2作为列表<a>代码）

Answer 1

请在主题的functions.php

中编写此代码

<?php

// add hook
add_filter( 'wp_nav_menu_objects', 'my_wp_nav_menu_objects_sub_menu', 10, 2 );

// filter_hook function to react on sub_menu flag
function my_wp_nav_menu_objects_sub_menu( $sorted_menu_items, $args ) {
  if ( isset( $args->sub_menu ) ) {
    $root_id = 0;
    // find the current menu item
    foreach ( $sorted_menu_items as $menu_item ) {
      if ( $menu_item->current ) {
        // set the root id based on whether the current menu item has a parent or not
      $root_id = ( $menu_item->menu_item_parent ) ? $menu_item->menu_item_parent : $menu_item->ID;
      break;
    }
  }
  // find the top level parent
  if ( ! isset( $args->direct_parent ) ) {
    $prev_root_id = $root_id;
    while ( $prev_root_id != 0 ) {
      foreach ( $sorted_menu_items as $menu_item ) {
        if ( $menu_item->ID == $prev_root_id ) {
          $prev_root_id = $menu_item->menu_item_parent;
          // don't set the root_id to 0 if we've reached the top of the menu
          if ( $prev_root_id != 0 ) $root_id = $menu_item->menu_item_parent;
            break;
          }
        }
      }
    }

    $menu_item_parents = array();
    foreach ( $sorted_menu_items as $key => $item ) {
      // init menu_item_parents
      if ( $item->ID == $root_id ) $menu_item_parents[] = $item->ID;

      if ( in_array( $item->menu_item_parent, $menu_item_parents ) ) {
      // part of sub-tree: keep!
        $menu_item_parents[] = $item->ID;
      } else if ( ! ( isset( $args->show_parent ) && in_array( $item->ID, $menu_item_parents ) ) ) {
      // not part of sub-tree: away with it!
      unset( $sorted_menu_items[$key] );
    }
  }
return $sorted_menu_items;
} else {
  return $sorted_menu_items;
}
}

然后你可以使用wp_nav_menu在你的主题中显示它（就像你通常那样），但是也传入一个sub_menu标志来激活自定义sub_menu函数：

<?php
wp_nav_menu( array(
  'theme_location' => 'primary',
  'sub_menu' => true
) );
?>

Answer 2

当您在页面上首先获得所有页面时，您可以获取当前页面ID，获取数组中的子项并循环遍历此数组：

<?php
    // First get all the pages in your site
    $wp_query = new WP_Query();
    $all_pages = $wp_query->query(array('post_type' => 'page'));

    // Then get your current page ID and children (out of all the pages)
    $current_page_id = get_the_id();
    $current_page_children = get_page_children($current_page_id, $all_pages);

    // Loop through the array of children pages
    foreach ($current_page_children as $child_page) {
        // Echo whatever you want from the pages
    }
?>

编辑：这与您在后端制作的结构化菜单无关，它与在页面编辑部分直接制作另一页的子页面有关。

Answer 3

这就是全部

<?php
global $wp_query;
if( empty($wp_query->post->post_parent) ) {
$parent = $wp_query->post->ID;
} else {
$parent = $wp_query->post->post_parent;
} ?>
<?php if(wp_list_pages("title_li=&child_of=$parent&echo=0" )): ?>
<div>
<ul>
<?php wp_list_pages("title_li=&child_of=$parent" ); ?>
</ul>
</div>
<?php endif; ?>

感谢所有解决方案！

Answer 4

我写了一个函数来帮助解决这个问题，因为我发现的大多数例子都包含页面子节点，但不包括父节点本身。只需将此功能添加到functions.php文件中：

<?php

// Display sub menu
function the_sub_menu()
{
    global $post;

    // Open list
    echo '<ul class="sub_menu">';

    // Sub page
    if($post->post_parent) {

        // Load parent
        $parent = get_post($post->post_parent);

        // Add parent to list
        echo '<li><a href="' . get_permalink($parent->ID) . '">' . $parent->post_title . '</a></li>';

        // Add children to list
        wp_list_pages('title_li=&child_of=' . $post->post_parent);

    // Parent page
    } else {

        // Add parent to list
        echo '<li class="current_page_item"><a href="' . get_permalink($post->ID) . '">' . $post->post_title . '</a></li>';

        // Add children to list
        wp_list_pages('title_li=&child_of=' . $post->ID);
    }

    // Close list
    echo '</ul>';
}

然后，要在页面上使用它，只需将其称为：

<?php get_header() ?>

    <?php while (have_posts()): the_post() ?>

        <!-- Include the sub menu! -->
        <?php the_sub_menu() ?>

        <article>
            <?php the_content() ?>
        </article>

    <?php endwhile ?>

<?php get_footer() ?>

Answer 5

您需要做的第一件事就是将'child1''child2'页面作为'关于我们'页面的子页面。

Click here to find out more on creating sub pages

一旦页面结构化，您就可以使用此功能，（link to docs）

<?php wp_list_pages( $args );  

 $args = array(
    'depth'        => 0,
    'show_date'    => '',
    'date_format'  => get_option('date_format'),
    'child_of'     => N,   //N here should be replaced by your About-us page ID. 
    'exclude'      => '',
    'include'      => '',
    'title_li'     => __('About Us'),   //here you can mention any title you like for the list that's echoed by this function
    'echo'         => 1,
    'authors'      => '',
    'sort_column'  => 'menu_order, post_title',
    'link_before'  => '',
    'link_after'   => '',
    'walker'       => '',
    'post_type'    => 'page',
    'post_status'  => 'publish' 
); ?>

同样适用于您的“我们的服务”页面，希望这可以解决您的问题。如果您遇到任何问题，请告诉我们。欢迎来到stackoverflow！

Answer 6

快速而“肮脏”的解决方案。

我创建了以下文件... / wp-content / plugins / gabriel-submenu.php

具有以下内容：

<?php
/**
 * @package Gabriel_SubMenu
 * @version 0.1
 */
/*
Plugin Name: Gabriel SubMenu
Plugin URI: http://www.nuage.ch
Description: My plugin to display a submenu
Author: Gabriel Klein
Version: 0.1
Author URI: http://www.nuage.ch
*/

function gab_submenu_content($a) {

        $d = array(
                'theme_location' => 'main_menu',
                'child_of'       => $a['id'],
                'echo'           => false,
                'sort_column'    => 'menu_order'
        );

        return wp_nav_menu( $d );

}

add_shortcode('gabsubmenu','gab_submenu_content' );


?>

然后在我的帖子中：

[gabsubmenu id = 93]

其中id是父页面的ID。

Answer 7

自定义菜单及其子菜单

function thewebpixel_header_menu(){ ?>
<a href="#" id="mobile-menu-trigger"> <i class="fa fa-bars"></i> </a>
<ul class="sf-menu fixed" id="menu">
    <?php
        $args = array(
        'order'                  => 'ASC',
        'orderby'                => 'menu_order',
        'post_type'              => 'nav_menu_item',
        'post_status'            => 'publish',
        'output'                 => ARRAY_A,
        'output_key'             => 'menu_order',
        'nopaging'               => true,
        'update_post_term_cache' => false );

        $items = wp_get_nav_menu_items( 'main', $args );
        $parents = array();
        foreach($items as $item )
          $parents[] = $item->menu_item_parent;

        function check_has_child($parents, $menu_id){

            if(in_array($menu_id, $parents))                     
              return "YES";
        else
          return "NO";  
         }       

        $flag = 0;
        $count = 0;
        foreach($items as $item ) { ?>
    <?php if( !$item->menu_item_parent ){ 
        if($count != 0 && $count != 5 && $flag == 2){ 
              echo '</ul></div></div></li>';
              $count=0; 
              $flag=0;
              }  

          if(check_has_child($parents, $item->ID ) == "YES")
          {
            $liclass = '';
            $aclass = 'class="sf-with-ul"';                 
          }else{

            $liclass = 'dropdown';
            $aclass = '';            
            }          
          ?> 
    <li class="<?php echo $liclass; ?>"><a <?php echo $aclass; ?> href="<?php echo $item->url;?>"><span><?php echo
        $item->title;?></span></a>
        <?php } ?>   
        <?php  if( $item->menu_item_parent){ if($flag != 2)$flag = 1;  ?>
        <?php if($flag == 1) {                                 
            $flag = 2;
            echo '<div class="sf-mega">';
             } 

            if($count == 0 ){
            echo '<div class="sf-mega-section"><ul>';
            }
            $count++;
            ?>                                                
    <li><a href="<?php echo $item->url; ?>">
        <i class="fa fa-angle-right"></i>
        <?php echo $item->title; ?>
        </a>
    </li>
    <?php
        if($count == 5){
          echo '</ul></div>';
          $count=0;
        }

        } ?>    
    <?php if( !$item->menu_item_parent && check_has_child($parents, $item->ID ) == "NO" ){ ?></li> <?php } ?>
    <?php }  ?>
</ul>
<?php } ?>

在https://developer.wordpress.org/reference/functions/wp_get_nav_menu_items/找到更多信息和示例。

仅显示当前父级及其子菜单 - wordpress

7 个答案: