2026年6月22日

2026年6月22日

WordPressのテーマでページごとに異なるサイドバーを表示する方法

ページごとにサイドバーの中身を変えたい場合、クラシックテーマでは「ウィジェットエリアを複数登録し、条件分岐タグやページテンプレートで出し分ける」方法が基本です。ブロックテーマにはふつうウィジェットエリアがないため、ページ用のテンプレートを分けて、それぞれに別のサイドバー部分を置きます。この記事では、両方の手順と、反映されないときの確認方法を説明します。

特定のページでサイドバーを「消す」だけなら、もっと簡単な方法があります。ここでは、ページによって「別の内容のサイドバー」を表示する方法を扱います。

先にテーマの設定を確認する

コードを書く前に、使っているテーマの設定を確認してください。国内外の多くのテーマには、投稿・固定ページごとにサイドバーの有無やレイアウトを選ぶ機能や、専用のウィジェットエリアが用意されています。テーマの機能で足りるなら、テーマ更新の影響を受けにくく、管理もしやすくなります。

テーマに機能がなく、コードで対応する場合は、親テーマを直接編集せず子テーマで作業します。作業前にはテーマファイルのバックアップを取り、ウィジェットの配置も控えておいてください。ウィジェットエリアの ID を変えたり削除したりすると、配置済みのウィジェットが「使用停止中のウィジェット」に移ることがあります。

クラシックテーマ:手順1 ウィジェットエリアを追加で登録する

まず、表示し分けたい数だけウィジェットエリアを登録します。子テーマの functions.php に、widgets_init フックで register_sidebar() を書きます。

<?php
add_action( 'widgets_init', function () {
	$common = array(
		'before_widget' => '<section id="%1$s" class="widget %2$s">',
		'after_widget'  => '</section>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	);

	register_sidebar( array_merge( $common, array(
		'name' => '固定ページ用サイドバー',
		'id'   => 'sidebar-page',
	) ) );

	register_sidebar( array_merge( $common, array(
		'name' => 'お問い合わせページ用サイドバー',
		'id'   => 'sidebar-contact',
	) ) );
} );

id は英小文字とハイフンで、ほかと重ならない名前にします。後で変えると配置済みのウィジェットが外れるため、最初に決めた名前を使い続けます。before_widget などの HTML は、親テーマのサイドバーと見た目を揃えるため、親テーマの functions.php にある register_sidebar() の記述に合わせておくと崩れにくいです。

保存すると「外観 > ウィジェット」に新しいエリアが表示されるので、それぞれにウィジェットを配置します。

クラシックテーマ:手順2 条件分岐で出し分ける

次に、どのページでどのエリアを出すかを決めます。親テーマの sidebar.php を子テーマにコピーし、dynamic_sidebar() を呼んでいる部分を書き換えます。

<?php
if ( is_page( 'contact' ) ) {
	$sidebar_id = 'sidebar-contact';
} elseif ( is_page() ) {
	$sidebar_id = 'sidebar-page';
} else {
	$sidebar_id = 'sidebar-1';
}

if ( ! is_active_sidebar( $sidebar_id ) ) {
	return;
}
?>
<aside id="secondary" class="widget-area">
	<?php dynamic_sidebar( $sidebar_id ); ?>
</aside>

is_page( 'contact' ) の引数には、固定ページのスラッグ・ID・タイトルを指定できます。スラッグは編集画面で変えられてしまうため、運用で変わりにくいものを選びます。条件は上から順に判定されるので、個別のページを先に、is_page() のような広い条件を後に書きます。

else の sidebar-1 は、親テーマがもともと使っていた ID に置き換えてください。<aside> の ID やクラス名も、親テーマの sidebar.php に書かれているものをそのまま残すと、親テーマの CSS が効いたままになります。

is_active_sidebar() でウィジェットが空かどうかを確認しているのは、空のエリアに枠だけが表示されるのを防ぐためです。

クラシックテーマ:別の方法 ページテンプレートで選べるようにする

出し分けの対象ページが増えてくると、条件分岐が長くなり管理しにくくなります。その場合は、ページテンプレートを作って、編集画面でサイドバーの種類を選べるようにする方法が向いています。

親テーマの page.php を子テーマにコピーし、ファイル名を変えて(例:page-sidebar-contact.php)、先頭にテンプレート名のコメントを書きます。

<?php
/*
Template Name: お問い合わせ用サイドバー
*/

そのうえで、ファイルの中の get_sidebar() を get_sidebar( 'contact' ) に変えます。get_sidebar( 'contact' ) は sidebar-contact.php を読み込むので、子テーマに sidebar-contact.php を作り、中で dynamic_sidebar( 'sidebar-contact' ) を呼びます。

固定ページの編集画面で、ページの設定にあるテンプレートの選択欄から「お問い合わせ用サイドバー」を選べば、そのページだけ別のサイドバーになります。どのページにどのサイドバーを使うかを、コードを触らずに切り替えられるのが利点です。

ブロックテーマの場合

ブロックテーマ(Twenty Twenty-Four、Twenty Twenty-Five など)では、サイドバーもテンプレートの中のブロックとして作ります。考え方は「ページテンプレートを分ける」方法と同じです。

  1. 「外観 > エディター」でテンプレートを開き、新しいテンプレートを追加します。特定の固定ページ専用のテンプレートも作成できます
  2. カラムブロックなどで本文とサイドバーの2列レイアウトを作ります
  3. サイドバー部分をテンプレートパーツとして保存しておくと、複数のテンプレートで使い回せます。内容を変えたいページ用には、別のテンプレートパーツを作ります
  4. 固定ページの編集画面で、ページの設定から使うテンプレートを選びます

テンプレートの種類や画面の表記はバージョンによって変わることがあるため、(2026年10月現在)の画面で近い項目を探してください。サイトエディターで作ったテンプレートはデータベースに保存され、テーマを切り替えると使われなくなる点にも注意してください。

表示されないときの確認ポイント

思ったサイドバーが出ないときは、次の順で確認すると原因を絞り込めます。

  • そのページで使われているテンプレートファイル:Query Monitor プラグインを使うと、表示中のページで読み込まれたテンプレートが分かります
  • 条件分岐の順番:広い条件(is_page())が個別の条件より先にあると、個別の分岐に到達しません
  • ウィジェットの配置:登録したエリアにウィジェットが入っていないと、is_active_sidebar() の判定で何も出力されません
  • テーマ側のレイアウト設定:テーマの設定で「1カラム」になっていると、サイドバー自体が出力されないことがあります
  • キャッシュ:キャッシュ系プラグインやサーバーのキャッシュを削除し、ログアウト状態で表示を確かめます

PHP の構文エラーで画面が真っ白になった場合は、FTP などで子テーマの該当ファイルを元に戻します。開発環境で WP_DEBUG を有効にすると、エラーの場所が表示されます。

まとめ

  • まず使っているテーマに、ページごとのサイドバー設定や専用エリアがないかを確認します
  • クラシックテーマでは register_sidebar() でエリアを追加し、子テーマの sidebar.php で is_page() などの条件分岐を使って出し分けます
  • 対象ページが多い場合は、ページテンプレートと get_sidebar( '名前' ) を組み合わせると、編集画面から切り替えられます
  • ブロックテーマでは、サイドバー部分をテンプレートパーツにして、ページ用のテンプレートを分けます
  • 表示されないときは、使われているテンプレート、条件の順番、ウィジェットの配置、キャッシュを順に確認します

お気軽にご相談ください

お見積りへ お問い合わせへ
▲