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

【问题标题】：Display current parent and its sub-menu only - wordpress仅显示当前父级及其子菜单 - wordpress
【发布时间】：2013-09-18 14:45:18
【问题描述】：

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

Page A: About Us
child1
child2

Page B : Our services
Child 3
Child 4

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

页面A
孩子 1
孩子 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 和 child2 作为带有 @ 的列表987654323@标签）

【问题讨论】：

是的，如果您向我们展示一些您尝试过的代码，我们会提供帮助

标签： php wordpress

【解决方案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
) );
?>

【讨论】：

为了便于阅读，我将您的代码缩进了一点。如果您在将 sub_menu 标志传递给 wp_nav_menu 时解释（新的？）返回值，那就太好了。
请不要在没有引用原作者的情况下盗取代码。 christianvarga.com/…

【解决方案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
    }
?>

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

【讨论】：

【解决方案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; ?>

感谢所有解决方案！

【讨论】：

【解决方案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() ?>

【讨论】：

Iiuc，这不会遍历菜单中定义的项目，而是使用 Page-Hierarchy。

【解决方案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！

【讨论】：

默认情况下，wp_list_pages 显示所有页面和子页面。但我只需要子页面。因此 title_li 应该持有其父级的子级的头衔。所以我需要先检索当前的父 ID。添加了一些代码来完成这一切。问题现已解决。感谢您的帮助和热烈欢迎

【解决方案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。

【讨论】：

【解决方案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/ 查找更多信息和示例。

【讨论】：