WordPress 3.0の新しいメニュー機能でwp_list_pages()を使用して子ページを表示するメニューを生成しますか?


10

以前は、次のようなロジックを使用して、現在選択されている親ページの子ページを選択的に読み込むことができました。

if(  $post->post_parent ) {
  $children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
} else {
  $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
}

if ($children) { ?>
   <ul id="subnav">
     <?php echo $children; ?>
   </ul>
<?php 
} else {
}

新しいregister_nav_menus()/ wp_nav_menu()機能を使用してこれを行うネイティブな方法はないようです。この時点で私がこれを一緒にパッチする方法を誰かが知っていますか?

これが私が達成しようとしていることのスクリーンショットです:

子メニューのスクリーンショットをドロップダウン


wp_nav_menuはページ階層(または、ページに関してはまったく)とは関係がないため、これは困難です。メニューについては、今のところ十分な知識がありませんが、非常に興味深い質問です。
John P Bloch、

私はその質問を完全に理解していません。あなたは何を成し遂げようとしているのですか?コードは表示されますが、コンテキストがわかりません。欲しいサイトを手に入れましたか?スクリーンショット?
MikeSchinkel、2010

彼は、新しいナビゲーションメニューAPIに条件付きで(つまり、そのツリー構造がアクティブな場合のみ)最上位メニュー項目の子項目を追加したいと考えています。
John P Bloch、

@John P. Bloch- 「ツリー構造がアクティブな場合のみ」とはどういう意味ですか?私たちはページだけを話しているのですか?投稿、カテゴリ、タグ、カスタム投稿などはどうですか?彼はjQueryを介してクライアントで、またはサーバーでそれを実行しますか?私はむしろ仮定したくないと思います、そして実際のユースケースについてもっと聞きたいです。
MikeSchinkel、2010

@MikeSchinkelこの特定のケースでは、私たちはページを話しているだけだと思いますが、それはとにかく問題ではありません。解決策は同じです。ZaMooseはサーバーサイドで実行したいと考えています。
John P Bloch、

回答:


9

私は、Page Sub Navigation(私が知っているのは賢い)という名前のウィジェットを作成しました。

これをインストールすると、ウィジェットをウィジェット領域の1つにドラッグするだけで、BAMが機能します。

<?php
/*
Plugin Name: Page Sub Navigation
Plugin URI: http://codegavin.com/wordpress/sub-nav
Description: Displays a list of child pages for the current page
Author: Jesse Gavin
Version: 1
Author URI: http://codegavin.com
*/

function createPageSubMenu()
{
  if (is_page()) {
    global $wp_query;

    if( empty($wp_query->post->post_parent) ) {
      $parent = $wp_query->post->ID;
    } else {
      $parent = $wp_query->post->post_parent;
    }

    $title = get_the_title($parent);

    if(wp_list_pages("title_li=&child_of=$parent&echo=0" )) {
      echo "<div id='submenu'>";
      echo "<h3><span>$title</span></h3>";
      echo "<ul>";
      wp_list_pages("title_li=&child_of=$parent&echo=1" );
      echo "</ul>";
      echo "</div>";
    }
  }
}


function widget_pageSubNav($args) {
  extract($args);
  echo $before_widget;
  createPageSubMenu();
  echo $after_widget;
}

function pageSubMenu_init()
{
  wp_register_sidebar_widget("cg-sidebar-widget", __('Page Sub Navigation'), 'widget_pageSubNav');
}
add_action("plugins_loaded", "pageSubMenu_init");
?>

または、ジューシーなパーツが欲しいだけなら...

if (is_page()) {
  global $wp_query;

  if( empty($wp_query->post->post_parent) ) {
    $parent = $wp_query->post->ID;
  } else {
    $parent = $wp_query->post->post_parent;
  }

  if(wp_list_pages("title_li=&child_of=$parent&echo=0" )) {
    wp_list_pages("title_li=&child_of=$parent&echo=1" );
  }
}

更新

私は本質的に同じことをする別のプラグインを見つけました(そして多分それはより良いです、私は知りません)。 http://wordpress.org/extend/plugins/subpages-widget/


これはSOなので、必要なものに非常に近いです。唯一の問題は、BuddyPressがアクティブなときに正しく動作しないことです。
ZaMoose、2010

2

あなたはこれを行うためにCSSハックを行うことができます(私が試す2つの方法)

1これは、CSSにサブナビゲーションのアイテムを表示させるための最も簡単な方法です。

.current-menu-ancestor ul {display:inline;}
.current-menu-parent ul (display:inline;}

2テーマがボディクラスをサポートしていると仮定すると、「サブナビゲーション」ごとにナビゲーションメニューを作成し、メインナビゲーションの下に表示するように設定できます。次に、スタイルシートを編集して、次のようなものを使用してサブナビゲーションdivのみを表示します。

.child-menu-about, .child-menu-leadership {display:none;}
body.page-id-YOUR_ABOUT_PAGE_ID .child-menu-about {display:inline;}
body.category-YOUR-CATEGORY-SLUG  .child-menu-leadership {display:inline;}

0

ここに画像の説明を入力してください 1これはphpディスプレイです。

ここに画像の説明を入力してください 2これはcssディスプレイです。


コードスクリーンショットとして回答を投稿することは、可能な限り最悪の方法です。回答を再編集してください。いくつかの説明の言葉も害にはなりません。
Picard

0
<nav class="site-nav children-link">
                <?php       

                    if(  $post->post_parent ) 
                    {
                      $children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
                    } 
                    else 
                    {
                      $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
                    }

                    if ($children) { ?>
                       <ul>

                            <?php echo $children; ?>

                       </ul>

                    <?php 
                        } else {
                        }
                ?>
        </nav>

CSS

/*children-links links*/

.children-link 
{       

        background-color: #1a5957;
        color:#FFF;
        font-size: 100%;

}

.children-link li
{
    margin: 10px;   


}

.children-link ul li a:link,
.children-link ul li a:visited 
{
        padding: 15px 17px;
        text-decoration: none;
        border: 1px solid #1a5957;

}
.children-link ul li a:hover 
{
        background-color: #1a5957;
        color:#FFF;
        font-weight: bold;

}
.children-link .current_page_item a:link,
.children-link .current_page_item a:visited
{

    background-color: #1a5957;
    color: #FFF;
    cursor: default;
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.