WordPressのナビゲーションメニューを設定する方法（クラシックテーマ・ブロックテーマ対応）

WordPress のナビゲーションメニューの設定方法は、使っているテーマの種類で大きく変わります。クラシックテーマでは「外観」→「メニュー」でメニューを作り、テーマが用意した表示位置に割り当てます。ブロックテーマでは、サイトエディターでヘッダーなどに置かれた「ナビゲーション」ブロックを編集します。この記事では両方の手順と、テーマ開発者向けに register_nav_menus() と wp_nav_menu() でメニューを組み込む方法、表示されないときの確認ポイントまでを解説します（2026年10月現在の WordPress 6 系の画面を前提としています）。

まずテーマの種類を確認する

管理画面の「外観」メニューの中身を見ると判別できます。

• 「メニュー」と「カスタマイズ」がある: クラシックテーマ
• 「エディター」があり、「メニュー」がない: ブロックテーマ

ブロックテーマでも、テーマやプラグインがメニューの位置を登録していると「メニュー」が表示されることがあります。迷ったら「外観」→「テーマ」で使用中のテーマを確認し、テーマの説明に「フルサイト編集」「ブロックテーマ」とあるかを見てください。

クラシックテーマでメニューを設定する

管理画面でメニューを作る

「外観」→「メニュー」を開き、「新しいメニューを作成」からメニュー名を付けて保存します。メニュー名は管理用の名前で、サイト上には表示されません。

左側の一覧から固定ページ、投稿、カテゴリー、カスタムリンクを選んで「メニューに追加」を押すと、右側に項目が並びます。項目をドラッグして少し右にずらすと、上の項目の子（サブメニュー）になります。項目を開くと表示名（ナビゲーションラベル）を変更できます。

画面右上の「表示オプション」を開くと、「リンクターゲット」「CSS クラス」「リンク関係（XFN）」などの追加項目を表示できます。特定の項目だけデザインを変えたいときは、ここで CSS クラスを付けるのが手軽です。

最後に、画面下部の「メニュー設定」または「位置の管理」タブで、テーマが用意した表示位置（ヘッダー、フッターなど）にメニューを割り当てて保存します。メニューを作っただけでは表示されず、位置への割り当てが必要な点がつまずきやすいところです。

テーマにメニューの位置を登録する

自作テーマや子テーマで新しい表示位置を用意するには、functions.php で register_nav_menus() を呼びます。after_setup_theme フックで登録するのが一般的です。

add_action( 'after_setup_theme', function () {
	register_nav_menus( array(
		'primary' => __( 'ヘッダーメニュー', 'your-textdomain' ),
		'footer'  => __( 'フッターメニュー', 'your-textdomain' ),
	) );
} );

配列のキー（primary、footer）がテンプレートから呼び出すときの識別子、値が管理画面に表示される名前です。登録すると、メニュー画面の「位置の管理」に選択肢として現れます。

テンプレートで出力する

登録した位置にメニューを出すには、header.php などで wp_nav_menu() を呼びます。

<?php if ( has_nav_menu( 'primary' ) ) : ?>
	<?php
	wp_nav_menu( array(
		'theme_location'       => 'primary',
		'container'            => 'nav',
		'container_class'      => 'site-nav',
		'container_aria_label' => 'メインメニュー',
		'menu_class'           => 'site-nav__list',
		'depth'                => 2,
		'fallback_cb'          => false,
	) );
	?>
<?php endif; ?>

各引数の意図は次のとおりです。

• theme_location: どの位置のメニューを出すか。メニュー名ではなく位置で指定すると、管理画面で割り当てを変えるだけで中身を差し替えられます。
• container と container_aria_label: 外側を <nav> にし、スクリーンリーダー向けの名前を付けます。ページ内に複数のナビゲーションがある場合に区別しやすくなります。
• depth: 表示する階層の深さ。CSS がサブメニュー1段までしか想定していないなら 2 にしておくと、深い階層を作られてもレイアウトが崩れません。
• fallback_cb: 位置にメニューが割り当てられていないときの代替表示。初期値では固定ページの一覧が出るため、意図しないリンクが並ぶのを避けたいなら false にし、has_nav_menu() で囲みます。

現在表示中のページに対応する項目には current-menu-item クラスと aria-current="page" が付き、親項目には current-menu-ancestor などのクラスが付きます。現在地の強調表示はこれらのクラスに CSS を当てるだけで実現できます。

リンクに独自のクラスや属性を付ける

<a> 要素にクラスを付けたい場合は、nav_menu_link_attributes フィルターを使います。位置を条件にしておくと、他のメニューに影響しません。

add_filter( 'nav_menu_link_attributes', function ( $atts, $menu_item, $args, $depth ) {
	if ( isset( $args->theme_location ) && 'primary' === $args->theme_location ) {
		$atts['class'] = 'site-nav__link';
	}
	return $atts;
}, 10, 4 );

<li> のクラスは nav_menu_css_class フィルターで調整できます。マークアップの構造自体を変えたい場合は、Walker_Nav_Menu を継承した独自 Walker を walker 引数に渡します。スマートフォン向けの開閉ボタン（ハンバーガーメニュー）は wp_nav_menu() の機能ではないため、ボタンの HTML、CSS、JavaScript をテーマ側で用意します。

ブロックテーマでメニューを設定する

サイトエディターでナビゲーションブロックを編集する

「外観」→「エディター」を開くと、サイトエディターの左側に「ナビゲーション」の項目があります。ここで既存のメニューを選ぶと、項目の追加・並べ替え・削除ができます。ヘッダーのテンプレートパーツを開いて、ナビゲーションブロックを直接選択して編集することもできます。

項目を追加するにはブロック内の「+」から固定ページやカスタムリンクを選びます。サブメニューは、項目を選択した状態でツールバーからサブメニューを追加する操作で作れます。ブロックテーマのメニューは wp_navigation という投稿タイプのデータとして保存され、ナビゲーションブロックはそのデータを参照して表示しています。そのため、同じメニューを複数のテンプレートで使い回せます。

クラシックメニューを取り込む

クラシックテーマからブロックテーマへ移行した場合、以前のメニューはそのままでは表示されません。ナビゲーションブロックの設定パネルにあるメニュー選択の中に、クラシックメニューを取り込む項目があるので、そこから既存のメニューを選ぶと wp_navigation のデータとして複製されます。取り込み後の編集は元のクラシックメニューには反映されないので、以降はブロック側だけを編集します。

スマートフォンでの表示

ナビゲーションブロックには、画面幅が狭いときに項目をボタンの中にまとめる「オーバーレイメニュー」の設定があります。モバイルのみ、常に、表示しない、から選べます。サブメニューを「クリックで開く」ようにする設定もあり、タッチ操作の端末ではホバーで開く方式より操作しやすくなります。設定を変えたら、エディターのプレビュー幅を切り替えるか、実機で開閉と項目のタップを確認します。

WP-CLI でメニューを操作する

複数サイトに同じメニューを作る場合や、手順を記録しておきたい場合は WP-CLI が便利です。

wp menu create "Main Menu"
wp menu location list
wp menu location assign main-menu primary
wp menu item add-post main-menu 2
wp menu item add-custom main-menu "お問い合わせ" https://example.com/contact/
wp menu item list main-menu

wp menu コマンドが扱うのはクラシックテーマのメニューです。ブロックテーマの wp_navigation のデータは、wp post list --post_type=wp_navigation のように投稿として確認します。本番で一括操作する前には、データベースのバックアップを取ってください。

表示されない・保存できないときの確認ポイント

• メニューが表示されない（クラシック）: 位置への割り当てが済んでいるか、テンプレートの theme_location と register_nav_menus() のキーが一致しているかを確認します。
• 位置の選択肢が出ない: register_nav_menus() が実行されているかを確認します。子テーマで登録している場合は、子テーマが有効になっているかも見ます。
• 意図しない固定ページ一覧が出る: メニューが割り当てられておらず、fallback_cb の代替表示が出ています。
• 項目が多いメニューで保存すると末尾が消える: PHP の max_input_vars（初期値 1000）を超えている可能性があります。サーバーの PHP 設定で値を引き上げるか、メニューを分割します。
• 変更が反映されない: キャッシュプラグインや CDN のキャッシュを削除してから確認します。

まとめ

• クラシックテーマは「外観」→「メニュー」で作成し、表示位置への割り当てまで行うと表示されます。
• テーマ側では register_nav_menus() で位置を登録し、wp_nav_menu() を has_nav_menu() で囲んで出力すると、未設定時の不要な表示を防げます。
• ブロックテーマはサイトエディターのナビゲーションブロックで編集し、メニューは wp_navigation のデータとして保存されます。
• 移行時はクラシックメニューをナビゲーションブロックに取り込み、以降はブロック側を編集します。
• 保存時に項目が消える場合は max_input_vars を疑います。

• Walkerクラスでナビゲーションメニューをカスタマイズする方法
• ブロックエディターのナビゲーションブロックの使い方