ページによってナビゲーションメニューを切り替える

本サイトでは、

TOPページでは、ページ内アンカーリンク
その他のページでは、TOPページへのページ外アンカーリンク

を基本的に付与しています。

アクションフックを使ったやり方が上手くいかず、急場しのぎでテーマのPHPファイルを直接書き換えていました。

今回、テーマの開発者の方が、テクニックとして公式マニュアルに提示頂いたので、ほぼそのままそっくり利用させて頂きました！感謝です！

※ナビゲーションメニューを切り替える行為はSEO的に不利という意見も聞いたので、気にされる方は注意してください。

アクションフックを使ったグローバルメニューの切り替え

アクションフックを使ったグローバルメニューの切り替え

今回は、Nishiki Pro のテーマを利用している前提でコードを記載していますが、フックをかける場所が「wp_nav_menu」なので、他のテーマでも多少の変更で流用は出来ると思います。

公式マニュアルでの説明

ほぼそのまま利用できるコードも提示されていますNishiki Pro：フックを使ってヘッダーメニュー、フッターメニューなどのメニューを条件によって出し分ける方法 | サポトピア特定のページでは A のメニューを、その他のページでは B のメニューを、など「メニューの出し分け」ができます。

support.animagate.com

私が途中まで自力でやっていた時は･･･

「add_filter」では無く「add_action」を利用
ナビゲーションメニューを格納する変数にそのまま返していた (今回は $nav_args)
フックをかける場所をそもそも間違えていた。

上述の理由から、CSSが上手く埋め込みされずに、レイアウトが崩れてしまうか、変数がテーマのファイルで上書きされてしまい、上手くいってませんでした。

本サイト記載内容

上記のマニュアルを受けて、書き換えてみました。
当然ですが、ちゃんと動いています!

今回も「functions.php」には記載せず、オリジナルプラグインに記載しています。

// 関数が定義されている場合は処理続行
if( ! function_exists( 'nishiki_pro_custom_nav_menu' ) ) {
	function nishiki_pro_custom_nav_menu( $nav_menu, $args ) {
		//ページがフロントページの場合かつ表示位置がグローバルナビの場合処理
		if( is_front_page() && $args->theme_location == 'global' ){
			$nav_args = array(
				'menu'			=> 'top_gnav_menu', //TOPページ用のメニュー
				'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 );
}

基本的に上記コードを記載しています。(若干メニュー名とか変えてます)

ちなみに、急場しのぎとして、Nishiki Pro の global.php に記載していました。

$nav_args = array(
    'theme_location'  	=> 'global',
    'container_class' 	=> '',
    'container'		=> '',
    'menu_id'		=> '',
    'items_wrap'	=> '<ul class="menu-items">%3$s</ul>',
    'walker'		=> new NISHIKI_PRO_WALKER_GLOBAL_NAV,
);

この部分を･･･

// フロントページもしくは固定ページ(home)の場合はメニューを切り替え。
if(is_front_page() || is_page('home')) {
	$nav_args = array(
		'menu'			=> 'top_gnav_menu',
		'theme_location'	=> 'global',
		'container_class'	=> '',
		'container'		=> '',
		'menu_id'		=> '',
		'items_wrap'		=> '<ul class="menu-items">%3$s</ul>',
		'walker'		=> new NISHIKI_PRO_WALKER_GLOBAL_NAV,
	);
} else {
	$nav_args = array(
		'theme_location'  	=> 'global',
		'container_class' 	=> '',
		'container'		=> '',
		'menu_id'		=> '',
		'items_wrap'		=> '<ul class="menu-items">%3$s</ul>',
		'walker'		=> new NISHIKI_PRO_WALKER_GLOBAL_NAV,
	);
}

このように書き換えていました。

この応用で、「ページ毎にフッターウイジェットの表示非表示を切り替える」も出来そうですね。
がんばる！