これから Nishiki Pro
テーマを使うなら1度は確認しよう!

Nishiki テーマおすすめ設定 テーマおすすめ設定を見る
  1. ホーム
  2. マニュアル
  3. Nishiki(Pro)
  4. Nishiki Pro:フックを使ってヘッダーメニュー、フッターメニューなどのメニューを条件によって出し分ける方法

Nishiki Pro テーマでは、ナビゲーションの役割として ヘッダーメニューフッターメニュー を設置できますが、これらのメニューはワードプレスの「カスタムメニュー機能」で管理しています。

というわけで、このページでは、特定の条件によってヘッダーメニュー、フッターメニューの内容を変更する方法を紹介しています。

注意!

ここからの情報は、PHP でコードが書けたり、ワードプレスのカスタマイズ知識や技術をある程度持っている上級者向けの内容として公開しています。

カスタマイズ用のプラグインを作ったり、子テーマを作って functions.php 内にコードを追記するなどで実装してください。

このようなカスタマイズがスラスラできるようになると、ワードプレスを扱う技術力も向上し、自信にもつながります。

もし駆け出しや初心者の方でも「やってみようかなぁ・・・」と、やる気がある方は、ぜひ挑戦してみてください!

サンプルコード

いきなりですがサンプルコードです。

if( ! function_exists( 'nishiki_pro_custom_nav_menu' ) ) {

 function nishiki_pro_custom_nav_menu( $nav_menu, $args ) {

  // 投稿ページ & 表示場所が global(ヘッダーメニュー)の場合で条件分岐。フッターメニューを変えたい場合は $args->theme_location == 'footer' をつければ OK
  if( is_single() && $args->theme_location == 'global' ){
   $nav_args = array(
    'menu'              => 'menu01', //変更したいメニューを指定(id,スラッグ,名前 のいずれか)。この場合はメニュー名を指定しています
    'container_class'   => '',
    'container'         => '',
    'menu_id'           => '',
    'echo'              => false,
    'items_wrap'        => '<ul class="menu-items">%3$s</ul>',
    'walker'            => new NISHIKI_PRO_WALKER_GLOBAL_NAV,
   );

   $nav_menu = wp_nav_menu( $nav_args );
  }

  return $nav_menu;
 }

 add_filter( 'wp_nav_menu', 'nishiki_pro_custom_nav_menu', 10, 2 );
}

wp_nav_menu フィルターを使って、投稿ページを表示している場合、ヘッダーメニューを menu01 に変更しています。

このコードを応用すれば、例えばトップページは menu01 を表示、その他のページは menu02 を表示など、メニューを出し分けることができます。

WordPress テーマ Nishiki Pro

「ウェブサイト運営に本当に必要とされる機能」をテーマ内にまとめて搭載したワードプレステーマです。

ブロックエディター機能を強化し、これまでのワードプレスでは難しかったコンテンツが簡単に作れます。

ブログ、ポートフォリオ、コーポレートサイト、ビジネスサイト、オンラインショップなど、様々な目的のウェブサイトに対応できるテーマです。

最新情報をチェック!

Nishiki / Nishiki Pro テーマに特化した情報を「にしきちゃん」がお伝えします😀

  • リリース情報
  • 新機能の紹介
  • 便利な使い方
  • 開発中の機能紹介
  • 導入事例
  • あるある日常ネタ

など