Question

以下是我的目标网页“产品”。它将显示2列，左侧是辅助导航，右侧是内容。我希望如果有人点击主导航“产品”。在第二个导航中，第一个项目将以粗体显示，并将显示内容。

<?php
/*
  Template Name: Product Navigation Page
*/
?>

<?php get_header(); ?>

  <div class="container page-border-top">

  <div id="product-navigation" class="col-md-3" style="border: 1px solid green;">

     <div id="navbar" class="navbar-collapse collapse">

      <?php

        $args2 = array(
          'menu'        => 'product-menu',
          'menu_class'  => 'nav navbar-nav',
          'theme_location' => 'product-menu',
          'container'   => 'false'
        );
        wp_nav_menu( $args2 );

      ?>

    </div><!--/.navbar-collapse -->

  </div>

  <div class="col-md-9" style="border: 1px solid red;">
        <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

          <?php the_content(); ?>

        <?php endwhile; endif; ?>
  </div>

  </div>

<?php get_footer(); ?>

Answer 1

如果您的目标网页＆＃34;产品＆＃34;没有父级，如果＆＃34;产品＆＃34;的所有产品子页面，则您可以将此模板文件用于登录页面和所有子页面（产品）：

<?php
/*
  Template Name: Product Navigation Page
*/

$redirect = false;
$parent_id = wp_get_post_parent_id( $post->ID );

if ( ! $parent_id ) {
    $redirect = true;
    $parent_id = $post->ID;
}

// get all child's
$all_wp_pages = $wp_query->query(array(
    'post_type' => 'page',
    'order' => 'ASC',
    'orderby' => 'menu_order',
    'post_status' => 'publish'
));

$childs = get_page_children( $parent_id, $all_wp_pages );

if ( $redirect ) {
    wp_redirect( get_permalink( $childs[0]->ID ) );
    exit;
}

$current_page_id = $post->ID;

?>

<?php get_header(); ?>

  <div class="container page-border-top">

  <div id="product-navigation" class="col-md-3" style="border: 1px solid green;">

     <div id="navbar" class="navbar-collapse collapse">

      <ul class="menu">
        <?php foreach ( $childs as $child ): ?>
          <li class="<?php if ( $current_page_id == $child->ID ): ?>current-menu-item<?php endif; ?>"><a href="<?php the_permalink( $child->ID ); ?>"><?php echo $child->post_name; ?></a></li>
        <?php endforeach; ?>
      </ul>

    </div><!--/.navbar-collapse -->

  </div>

  <div class="col-md-9" style="border: 1px solid red;">
        <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

          <?php the_content(); ?>

        <?php endwhile; endif; ?>
  </div>

  </div>

<?php get_footer(); ?>

您不必为产品创建菜单，只列出所有子页面，您可以按订单字段（页面属性）对产品进行排序。

一步一步：

创建一个页面＆＃34;产品＆＃34;并为其选择上面的模板文件（产品导航页面）
创建一些产品页面作为＆＃34;产品＆＃34;的孩子。并为其选择上面的模板文件（产品导航页面）。

模板文件将在左侧自动创建所需的辅助导航。当前产品有一个css类current-menu-item，因此您可以用粗体设置它。

此部分生成第二个导航：

<ul class="menu">
  <?php foreach ( $childs as $child ): ?>
    <li class="<?php if ( $current_page_id == $child->ID ): ?>current-menu-item<?php endif; ?>"><a href="<?php the_permalink( $child->ID ); ?>"><?php echo $child->post_name; ?></a></li>
  <?php endforeach; ?>
</ul>

wordpress主要和次要导航

1 个答案: