コードのカスタマイズが必要な HTML 構造がありますwp_nav_menu
。
生成する必要がある HTML は次のとおりです。
<ul class="main-nav">
<li class="item">
<a href="http://example.com/?p=123" class="title">Title</a>
<a href="http://example.com/?p=123" class="desc">Description</a>
<ul class="sub-menu">
<li class="item">
<a href="http://example.com/?p=123" class="title">Title</a>
<a href="http://example.com/?p=123" class="desc">Description</a>
</li>
</ul>
</li>
<li class="item">
<a href="http://example.com/?p=123" class="title">Title</a>
<a href="http://example.com/?p=123" class="desc">Description</a>
</li>
</ul>
wp_get_nav_menu_items
現在、メニューからすべての項目を配列として取得するために使用しています。
今のところ、上記のHTMLを生成することができますサブメニューなし次のコードを使用します。
<?php
$menu_name = 'main-nav';
$locations = get_nav_menu_locations()
$menu = wp_get_nav_menu_object( $locations[ $menu_name ] );
$menuitems = wp_get_nav_menu_items( $menu->term_id, array( 'order' => 'DESC' ) );
foreach ( $menuitems as $item ):
$id = get_post_meta( $item->ID, '_menu_item_object_id', true );
$page = get_page( $id );
$link = get_page_link( $id ); ?>
<li class="item">
<a href="<?php echo $link; ?>" class="title">
<?php echo $page->post_title; ?>
</a>
<a href="<?php echo $link; ?>" class="desc">
<?php echo $page->post_excerpt; ?>
</a>
</li>
<?php endforeach; ?>
関数を使用してメニューを生成しましたwp_nav_menu
が、 を使用して表示される説明がまだ必要です$page->post_excerpt
。
$item->menu_item_parent
各項目には、親メニュー項目の ID を指定するというプロパティがあることがわかりました。
ループ内でサブメニューを生成するにはどうすればよいでしょうか? あるいは、 Google が言及し忘れたforeach
非常に簡単な方法があるのでしょうか?wp_nav_menu
ベストアンサー1
同様の問題に取り組んでいる人のために、私の解決策を以下に示します。
Gist の簡単なコード例
コードはこちらコピー&ペーストアクションに参加したい人のために、github gist に載せました。
要約
TL;DR リストをループし、サブメニューがある場合はドリルダウンし、サブメニューとメニューの最後まで到達した場合は閉じます。
完全なコードの説明
まず、メニュー項目をフラットな配列として取得します。
<?php
$menu_name = 'main_nav';
$locations = get_nav_menu_locations();
$menu = wp_get_nav_menu_object( $locations[ $menu_name ] );
$menuitems = wp_get_nav_menu_items( $menu->term_id, array( 'order' => 'DESC' ) );
?>
次に、メニュー項目の配列を反復処理します。
<nav>
<ul class="main-nav">
<?php
$count = 0;
$submenu = false;
foreach( $menuitems as $item ):
// set up title and url
$title = $item->title;
$link = $item->url;
// item does not have a parent so menu_item_parent equals 0 (false)
if ( !$item->menu_item_parent ):
// save this id for later comparison with sub-menu items
$parent_id = $item->ID;
?>
最初の親項目を記述します<li>
:
<li class="item">
<a href="<?php echo $link; ?>" class="title">
<?php echo $title; ?>
</a>
<?php endif; ?>
このアイテムの親 ID が保存されている親 ID と一致することを確認します。
<?php if ( $parent_id == $item->menu_item_parent ): ?>
サブメニューを開始し<ul>
、$submenu
後で参照できるようにフラグを true に設定します。
<?php if ( !$submenu ): $submenu = true; ?>
<ul class="sub-menu">
<?php endif; ?>
サブメニュー項目を記述します。
<li class="item">
<a href="<?php echo $link; ?>" class="title"><?php echo $title; ?></a>
</li>
次の項目が同じ親IDを持たず、サブメニューが宣言されている場合は、サブメニューを閉じます。<ul>
<?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id && $submenu ): ?>
</ul>
<?php $submenu = false; endif; ?>
<?php endif; ?>
繰り返しますが、配列内の次の項目が同じ親IDを持たない場合は、<li>
<?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id ): ?>
</li>
<?php $submenu = false; endif; ?>
<?php $count++; endforeach; ?>
</ul>
</nav>