2026年8月8日

WordPressにPostHogを導入する方法｜分析・セッションリプレイ・機能フラグの設定

SEO・パフォーマンス

WordPressにPostHogを導入するには、PostHogのプロジェクト設定に表示されるJavaScriptスニペットを、子テーマから条件付きで読み込むのが基本です。この記事では、スニペットの設置方法、管理者や決済ページの除外、capture と identify によるイベント送信、セッションリプレイのマスキング、同意取得と表示速度への配慮までをまとめます。

PostHogでできること

PostHogは、複数の機能を1つのプロジェクトで扱えるプロダクト分析の基盤です。WordPressサイトで使う機会が多いのは次の機能です。

プロダクト分析：イベントの集計、ファネル、リテンションなど、行動の流れの分析
セッションリプレイ：訪問者の画面操作を再生して、どこで迷っているかを確認する機能
機能フラグ：一部の訪問者にだけ新しいデザインや機能を表示する仕組み

提供形態はクラウド版が中心で、データの保存先としてUSとEUのリージョンがあります。オープンソースとして公開されているため自社サーバーで運用する選択肢もありますが、運用負荷やサポート範囲はクラウド版と異なるので、公式ドキュメントで現在の位置づけを確認してから選んでください（2026年10月現在）。

導入前に整理しておくこと

PostHogはセッションリプレイまで扱えるぶん、ほかの分析ツールより取得する情報が多くなります。設置の前に次を決めておきます。

リージョン：プロジェクト作成時に選んだUSかEUかで、送信先（スニペット内の api_host）が変わります。スニペットは管理画面からコピーし、送信先を手で書き換えないようにします
除外するページと人：管理者・編集者、wp-admin、WooCommerceのチェックアウトとマイアカウント、会員情報の編集画面などは計測しない方針にします
同意と告知：Cookieを使う計測やセッションリプレイは、地域や業種によって事前同意が求められます。自サイトに当てはまるルールは自社で確認し、必要に応じて専門家に相談してください。プライバシーポリシーには、PostHogの利用、画面操作を記録すること、利用目的を記載します

スニペットを子テーマから読み込む

ヘッダーにコードを挿入するプラグインにスニペットを貼るだけでも動きますが、それでは管理者の閲覧やチェックアウト画面まで記録されます。本番では子テーマから読み込み、条件分岐を入れる方法が適しています。作業前に functions.php のバックアップを取ってください。

PostHogのプロジェクト設定からWeb用のスニペットをコピーします
子テーマに js/posthog-snippet.js を作り、<script> タグを除いた中身を貼り付けます
自前のイベント送信用に js/posthog-events.js を作ります
functions.php に次のコードを追加します

<?php
function my_posthog_should_load() {
	// 投稿の編集権限を持つスタッフは計測しない
	if ( is_user_logged_in() && current_user_can( 'edit_posts' ) ) {
		return false;
	}
	if ( is_preview() || is_customize_preview() ) {
		return false;
	}
	// WooCommerce の決済・アカウント画面は除外
	if ( function_exists( 'is_checkout' ) && is_checkout() ) {
		return false;
	}
	if ( function_exists( 'is_account_page' ) && is_account_page() ) {
		return false;
	}
	return true;
}

function my_posthog_enqueue() {
	if ( ! my_posthog_should_load() ) {
		return;
	}
	$dir = get_stylesheet_directory();
	$uri = get_stylesheet_directory_uri();
	if ( ! file_exists( $dir . '/js/posthog-snippet.js' ) || ! file_exists( $dir . '/js/posthog-events.js' ) ) {
		return;
	}

	wp_enqueue_script( 'my-posthog', $uri . '/js/posthog-snippet.js', array(), filemtime( $dir . '/js/posthog-snippet.js' ), false );
	wp_enqueue_script( 'my-posthog-events', $uri . '/js/posthog-events.js', array( 'my-posthog' ), filemtime( $dir . '/js/posthog-events.js' ), true );

	// ログイン中の会員には、個人を直接特定しない識別子を渡す
	if ( is_user_logged_in() ) {
		$distinct_id = hash_hmac( 'sha256', (string) get_current_user_id(), wp_salt( 'auth' ) );
		wp_add_inline_script(
			'my-posthog-events',
			'window.myPosthogUser = ' . wp_json_encode( array( 'id' => $distinct_id ) ) . ';',
			'before'
		);
	}
}
add_action( 'wp_enqueue_scripts', 'my_posthog_enqueue' );

wp_enqueue_scripts はフロント側でだけ動くため、このコードでは管理画面に出力されません。識別子にWordPressのユーザーIDをそのまま使わず、wp_salt() を鍵にしたハッシュにしているのは、外部サービスに渡す値から会員を直接たどれないようにするためです。ログイン中のユーザーにだけ値を出力するので、ログインユーザーをページキャッシュの対象外にしている構成が前提です。

capture と identify でイベントを送る

PostHogは初期設定でページビューや一部のクリックを自動で取得しますが、事業上の重要な操作は posthog.capture() で明示的に送ると、後から集計しやすくなります。次の posthog-events.js は、会員の識別、資料請求ボタンのクリック、ログアウト時の識別解除を行う例です。

( function () {
	if ( ! window.posthog ) {
		return;
	}
	// ログイン会員の識別
	if ( window.myPosthogUser && window.myPosthogUser.id ) {
		window.posthog.identify( window.myPosthogUser.id );
	}
	document.addEventListener( 'click', function ( e ) {
		var cta = e.target.closest( 'a.download-cta' );
		if ( cta ) {
			window.posthog.capture( 'download_cta_clicked', {
				page_path: window.location.pathname
			} );
		}
		// WordPress のログアウトリンクで識別情報をリセット
		if ( e.target.closest( 'a[href*="action=logout"]' ) ) {
			window.posthog.reset();
		}
	} );
} )();

identify() を呼ぶと、それまで匿名だった閲覧履歴が同じ人物のものとして結び付けられます。共用端末で別の人がログインしたときに履歴が混ざらないよう、ログアウト時に reset() を呼んでおくのがポイントです。

機能フラグを使うときの注意

機能フラグは、管理画面で作成したフラグのキーを使い、posthog.isFeatureEnabled() で判定します。フラグの値はサーバーから取得されるため、読み込み直後は判定結果がまだ無い場合があります。posthog.onFeatureFlags() に処理を渡して、取得後に表示を切り替える形にします。

ブラウザ側で表示を切り替えると、一瞬だけ元の表示が見えるちらつきが起きます。ボタンの文言や色の比較には向いていますが、記事本文のように検索エンジンに評価してほしい部分の出し分けには使わない方が無難です。

セッションリプレイのプライバシー設定

セッションリプレイを有効にする場合は、記録する範囲を最初に絞ります。

入力欄のマスキング：パスワードや入力内容が記録されないよう、入力欄のマスキングが有効になっているかを、プロジェクトの設定画面と posthog.init() のオプションの両方で確認します
要素単位の除外：個人情報が表示される要素には ph-no-capture クラスを付けると、その要素を自動取得や記録の対象外にできます。対応範囲は公式ドキュメントで確認してください
ページ単位の除外：前述のPHPの条件分岐で、チェックアウトやマイアカウントではスクリプト自体を読み込まないのが最も確実性の高い方法です

マスキングは「設定したつもり」になりやすい部分です。設定後に自分で操作して録画を再生し、氏名やメールアドレスが映っていないかを目で確認してください。

同意を得てから計測する

事前同意が必要な場合は、posthog.init() のオプションで既定を「計測しない」状態にしておき、同意が得られた時点で posthog.opt_in_capturing()、撤回時に posthog.opt_out_capturing() を呼ぶ方法が使えます。同意バナーのプラグイン側で、スクリプトを「統計」カテゴリに分類して同意前は実行しない方法もあります。

どちらの方法でも、同意の判定はブラウザ側で行います。PHPで同意Cookieを見て出力を切り替えると、ページキャッシュされたHTMLが同意していない訪問者にも配信されてしまいます。

表示速度と計測漏れへの対策

PostHogのライブラリは非同期で読み込まれますが、セッションリプレイを有効にするとDOMの変化を記録する処理が加わります。導入前後でPageSpeed Insightsを計測し、特にスマートフォンのINPや合計ブロック時間を比べてください。

キャッシュプラグインのJavaScript結合や遅延実行の対象にスニペットが含まれると、読み込み順が崩れて window.posthog が未定義になることがあります。その場合は posthog-snippet.js を除外対象に加えます。広告ブロッカーによる計測漏れについては、PostHogが公式に案内しているリバースプロキシ経由の送信という選択肢もありますが、サーバー設定が必要になるため、まずは通常の設置で運用を始めるのが現実的です。

動作確認

ログアウトした状態、またはシークレットウィンドウでサイトを開き、次を確認します。

開発者ツールのネットワークタブで、スニペットに書かれた送信先への通信が発生しているか
PostHogのアクティビティ画面（受信したイベントの一覧）に自分の操作が表示されるか
管理者でログインした状態とチェックアウト画面では通信が発生しないか
セッションリプレイの録画で、入力内容がマスクされているか

まとめ

PostHogはスニペットを子テーマに置き、wp_enqueue_scripts で条件付きで読み込むと、管理者や決済画面を除外できる
送信先はUS／EUのリージョンで異なるため、スニペットは管理画面からコピーしたものを使う
capture で重要な操作を明示的に送り、会員は identify で識別、ログアウト時は reset で解除する
セッションリプレイは入力欄のマスキングと ph-no-capture を確認し、録画を再生して検証する
同意の判定はブラウザ側で行い、プライバシーポリシーへの記載と速度の確認を行う