2026年10月1日

2026年10月1日

Astraのフックで子テーマから管理しやすくカスタマイズする方法

Astra テーマのカスタマイズを長く保守できる形にするには、テンプレートファイルを子テーマにコピーして書き換えるのではなく、Astra が用意しているアクションフック(astra_header_before や astra_entry_content_after など)に、子テーマから関数を登録して差し込むのが基本です。この記事では、フックの一覧、子テーマ内でのファイルの分け方、表示条件と優先度の付け方、フックの位置の確かめ方、表示されないときの確認手順を説明します。

「Astra の Hooks API」という名前の独立した仕組みがあるわけではありません。実体は、Astra がテンプレートの各所で呼んでいる do_action() と、WordPress 標準の add_action() の組み合わせです。フックそのものの考え方は WordPressのフック(アクションとフィルター)の基本 で説明しています。

テンプレートの上書きよりフックを使う理由

子テーマに header.php や single.php をコピーして直接書き換える方法でも見た目は変えられます。しかし Astra はテンプレートの中身を更新で整理していくため、コピーした古いテンプレートが新しい親テーマと噛み合わなくなり、レイアウト崩れや機能の欠落につながることがあります。

フックを使う場合、子テーマが持つのは「この場所にこれを出す」という差分だけです。親テーマが更新されても、フックの名前が残っている限り差し込みはそのまま動きます。また、追加した内容が子テーマの PHP ファイルに集まるので、どこで何を変えたかを後から追いやすくなります。

Astra の主なフック

Astra は、ページの上から下まで多数のアクションフックを用意しています。よく使うものを位置の順に挙げます。以下の名前は、2026年10月時点の Astra 4.14 のテーマファイルで do_action() が呼ばれていることを確認したものです。

フック名 位置
astra_body_top <body> の直後(wp_body_open の直前)
astra_header_before / astra_header_after ヘッダーの前後
astra_content_before / astra_content_after メインコンテンツ領域の前後
astra_primary_content_top / astra_primary_content_bottom 本文エリア(サイドバーを除く)の先頭と末尾
astra_entry_content_before / astra_entry_content_after 投稿本文の直前と直後(一覧ページでは記事ごとに呼ばれる)
astra_footer_before / astra_footer_after フッターの前後
astra_body_bottom </body> の直前

フックの一覧は Astra の公式ドキュメント(Hooks Library)にもまとまっています。ヘッダー・フッタービルダーの導入以降、ヘッダー内部の細かな位置のフックは構成によって呼ばれないことがあるため、使う前に実際の画面で発火するかを確かめてください。確かめ方は後半で紹介します。

コードを書かずに同じことをしたい場合は、次の選択肢もあります。

  • 有料版の Astra Pro には、管理画面で作ったコンテンツをフックの位置に表示条件付きで差し込むモジュールがあります(2026年10月時点の名称は Site Builder)。名称や画面はバージョンで変わっているので、利用中のバージョンのドキュメントで確認してください。
  • Astra の開発元 Brainstorm Force が配布している無料プラグイン「Astra Hooks」は、カスタマイザーからフックの位置にコンテンツを入力できるものです。ただし表示条件を細かく指定する機能はありません。

複数人で運用し、コードを触れる人が限られるサイトでは、こうした管理画面からの方法のほうが管理しやすいこともあります。

ステップ1:子テーマを用意してファイルを分ける

作業前にバックアップを取り、ステージング環境で試します。Astra の子テーマがまだなければ作成し(作り方は WordPressの子テーマの作り方)、functions.php には読み込み処理だけを書きます。差し込む内容は機能ごとにファイルを分けます。

astra-child/
├── style.css
├── functions.php
├── inc/
│   └── astra-hooks.php
└── template-parts/
    └── hooks/
        ├── notice-bar.php
        └── post-cta.php
<?php
// astra-child/functions.php
add_action( 'wp_enqueue_scripts', function () {
	wp_enqueue_style(
		'astra-child',
		get_stylesheet_uri(),
		array( 'astra-theme-css' ),
		wp_get_theme()->get( 'Version' )
	);
}, 15 );

// 親テーマが Astra のときだけ、フック関連の処理を読み込む。
if ( 'astra' === get_template() ) {
	require_once get_stylesheet_directory() . '/inc/astra-hooks.php';
}

依存先に指定している astra-theme-css は Astra 本体のスタイルシートのハンドル名です。ブラウザの開発者ツールで、子テーマの CSS が親の後に読み込まれているかを確認しておきます。

get_template() で親テーマを確かめているのは、誤ってテーマを切り替えたときに Astra 専用の関数呼び出しでエラーにならないようにするためです。Astra の関数(たとえば設定値を読む astra_get_option())を使う箇所では、function_exists() でも確認しておきます。

ステップ2:フックへの登録は1か所にまとめる

inc/astra-hooks.php には「どのフックに、どの関数を、どの優先度で」という登録だけを並べます。ここを見ればサイトに加えた変更の一覧になる、という状態を目指します。

<?php
// astra-child/inc/astra-hooks.php
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

add_action( 'astra_header_before', 'astra_child_notice_bar', 10 );
add_action( 'astra_entry_content_after', 'astra_child_post_cta', 20 );

function astra_child_notice_bar() {
	if ( ! is_front_page() ) {
		return;
	}
	get_template_part( 'template-parts/hooks/notice-bar' );
}

function astra_child_post_cta() {
	if ( ! is_singular( 'post' ) ) {
		return;
	}
	get_template_part( 'template-parts/hooks/post-cta', null, array(
		'post_id' => get_the_ID(),
	) );
}

無名関数ではなく名前付き関数にしているのは、後から remove_action() で外したり、別のコードから位置を変えたりできるようにするためです。関数名には astra_child_ のような接頭辞を付け、他のテーマやプラグインとの衝突を避けます。

表示する HTML は template-parts/hooks/ 以下に分けます。get_template_part() は子テーマを先に探すので、マークアップの修正は PHP の登録部分に触れずに済みます。第3引数で渡した値はテンプレート側で $args として受け取れます(WordPress 5.5 以降)。

<?php
// astra-child/template-parts/hooks/post-cta.php
$post_id = isset( $args['post_id'] ) ? (int) $args['post_id'] : 0;
?>
<aside class="astra-child-cta">
	<p><?php echo esc_html( get_the_title( $post_id ) ); ?> について相談したい方はこちら</p>
	<a class="ast-button" href="<?php echo esc_url( home_url( '/contact/' ) ); ?>">お問い合わせ</a>
</aside>

notice-bar.php も同じように、表示する HTML だけを書きます。

<?php
// astra-child/template-parts/hooks/notice-bar.php
?>
<div class="astra-child-notice-bar">
	<p><?php echo esc_html( '年末年始の営業日のお知らせ' ); ?></p>
</div>

出力する値は esc_url() や esc_html() でエスケープします。投稿のタイトルや設定値を差し込む場合も同じです。

ステップ3:表示条件と優先度を決める

フックの中身は、条件分岐タグで「どのページに出すか」を最初に判定し、対象外なら何も出さずに戻ります。よく使うのは is_front_page()、is_singular( 'post' )、is_page( 'contact' )、is_archive()、has_category( 'news' ) などです。条件を関数の先頭にまとめておくと、表示されない原因を探すときに確認する場所が1か所で済みます。

astra_entry_content_after のように一覧ページでも記事ごとに呼ばれるフックは、条件を付けないと一覧の記事の数だけ出力されます。上の例で is_singular( 'post' ) を判定しているのはそのためです。

同じフックに複数の関数を登録した場合は、add_action() の第3引数(優先度)が小さい順に実行されます。既定値は10です。Astra 自身や他のプラグインも同じフックを使っていることがあるので、Astra の出力より後に出したいときは20や30のように間隔を空けた値を使います。数値を詰めすぎないほうが、後から間に別の処理を挟みやすくなります。優先度が効かないときの調べ方は WordPressのフックの優先度が効かないときの対処法 を参照してください。

Astra が標準で出している要素を消したい場合は、まずカスタマイザーの表示設定で消せないかを確認します。設定がない要素を消すときは、Astra のソースで該当する add_action() を探し、同じフック名・関数名・優先度を指定して remove_action() を呼びます。Astra 側の登録が済んだ後でないと外せないため、wp アクションなどのタイミングで実行します。この方法は親テーマの内部実装に依存するので、更新のたびに動作を確認する対象に入れておきます。

ステップ4:フックの位置を画面で確かめる

どのフックがページのどこで呼ばれているかは、管理者にだけ目印を表示する小さな仕組みを作ると確認しやすくなります。ステージング環境で一時的に inc/astra-hooks.php などに追加し、確認が終わったら削除します。

<?php
// 管理者がURLに ?astra_hooks=1 を付けたときだけ、フック名を表示する(確認用)。
add_action( 'wp', function () {
	if ( ! current_user_can( 'manage_options' ) || empty( $_GET['astra_hooks'] ) ) {
		return;
	}
	$hooks = array(
		'astra_body_top', 'astra_header_before', 'astra_header_after',
		'astra_content_before', 'astra_primary_content_top',
		'astra_entry_content_before', 'astra_entry_content_after',
		'astra_primary_content_bottom', 'astra_content_after',
		'astra_footer_before', 'astra_footer_after', 'astra_body_bottom',
	);
	foreach ( $hooks as $hook ) {
		add_action( $hook, function () use ( $hook ) {
			echo '<div style="border:1px dashed #c00;padding:4px;font:12px monospace;">'
				. esc_html( $hook ) . '</div>';
		}, 1 );
	}
} );

ログインした状態で https://example.com/?astra_hooks=1 のように開くと、各フックの位置に点線の枠でフック名が表示されます。目印が出ないフックは、そのページの構成では呼ばれていません。ページビルダーの全幅テンプレートやキャンバス系のテンプレートでは、ヘッダーやフッター周りのフックが呼ばれないことがよくあります。

表示されないときの確認手順

可能性の高い順に確認します。

  1. キャッシュ:キャッシュプラグインやサーバー、CDN のキャッシュを削除し、ログアウト状態でも確認します。
  2. 条件分岐:関数の先頭で return していないか、一時的に条件を外して表示されるかを見ます。
  3. フックが呼ばれていない:ステップ4の目印で、そのページでフックが発火しているかを確かめます。
  4. ファイルが読み込まれていない:get_template() の判定や require_once のパスを確認します。PHP エラーは wp-config.php で WP_DEBUG と WP_DEBUG_LOG を有効にして wp-content/debug.log を見ます。
  5. CSS で隠れている:開発者ツールで要素が HTML にあるのに見えない場合は、CSS の指定や重なりを確認します。

まとめ

  • Astra のカスタマイズは、テンプレートのコピーではなくアクションフックへの関数登録で行うと、親テーマの更新の影響を受けにくくなります。
  • 子テーマの functions.php は読み込みだけにし、フックの登録は inc/astra-hooks.php に、HTML は template-parts/hooks/ に分けます。
  • 名前付き関数と接頭辞を使い、条件分岐タグは関数の先頭に、優先度は間隔を空けて設定します。
  • フックが発火するかは構成で変わるため、目印を表示して確かめてから使います。
  • コードを触る人が限られる場合は、Astra Pro の管理画面から差し込む機能も検討できます。

お気軽にご相談ください

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