お問い合わせはコチラから

【WordPress】カスタムメニューにカテゴリやタームを自動的に追加する

サイト運営

カテゴリやカスタムタクソノミーのタームを動的に追加しているサイトで、ヘッダーのカスタムメニューのサブアイテムとして自動的に表示したいときに色々調べました。

項目が多く、動的に増えていくのでメガメニューで表示したいということです。

当初は、メニューそのものにデータ登録する方法を見つけたのですが、うまくいかず、最終的にはフックでHTMLを書き換える方法でうまくいきました。

ナビメニューのhookを使ってサブアイテムにカテゴリやタームを自動的に追加する

親項目のIDは検証ツールなどでHTMLを見ればわかります。

/* Auto CPT Menu  */
add_filter( 'wp_nav_menu_objects', 'wpg2byt_add_term_parent');
 function wpg2byt_add_term_parent( $items) {
   $terms = get_terms( array(
     'taxonomy' => 'wpbb_job_type', // enter the reference for your CPT catagory
     'hide_empty' => false,
  ) );

   foreach ($terms as $term) {
   //format its data to be compatible with the filter
   $link = array (
         'title'            =>  $term->name,
         'menu_item_parent' => 4533, // get the ID of your menu item with inspect element, this will make the catagories go under this as a submenu
         'ID'               => $term->term_id,
         'db_id'            => '',
         'url'              => get_term_link($term),
         'classes'          => array( 'cpt-auto-populate' ) // include a class to the newly added categories menu items
     );
   $items[] = (object) $link;
   }
   return $items;    
 }
Auto adding new post categories to menu
Support » Developing with WordPress » Auto adding new post categories to menu Auto adding new post categories to menu jodybethw (@jodybethw) 8 months, 3 weeks a...

max mega menuなどのメガメニュー系プラグインとの組み合わせで動かない

この方法は、項目が増えるので最終的にメガメニューで表示する前提ですが、メガメニューのプラグインを入れるとうまく動きませんでした。

その場合は、後述するプラグインを組み合わせることで解決できます。

項目が多い場合は破綻する

このソリューションはとても便利だったのですが、タームが100以上になると破綻しました。

登録するタームの基準を決めたり、最大数を決めないと、UX的に意味が無くなる方法だと思います。

例えば、タームに登録されている記事数がいくつ以上とか、そういう基準で登録する方が良さそうです。

プラグインを使って自動的にメニューに追加する

カテゴリなどを階層的に一括登録できるプラグインがあります。

このプラグインはとても便利なのですが、テーマや他のプラグインと組み合わせると動かない場合もあります。

JC Submenu
JC Submenu plugin allows you to automatically populate your navigation menus with custom post_types, taxonomies, or child pages.

max mega menuとの組み合わせで、動かない場合は以下のスニペットを追加してみてください。

//Enable compatibility with theme custom menu walkers

add_filter('jcs/enable_public_walker', 'jc_disable_public_walker');

function jc_disable_public_walker($default){
    return false;
}

まとめ

動的にメニューを追加する方法は覚えておいて損はないですが、そもそも動的に数が変わるものは表示領域が限られている場合は少し考える必要があります。

タイトルとURLをコピーしました