WordPressでOpenReplayのセッションリプレイを使うには、OpenReplayのプロジェクトで発行されるトラッキングコードを、子テーマから条件付きで読み込みます。この記事では、セルフホストとクラウドの選び方、トラッキングコードの設置、管理者や決済画面の除外、入力内容のマスキング、同意取得と表示速度への配慮、動作確認までを説明します。
OpenReplayとは
OpenReplayは、訪問者のブラウザ上での操作（スクロール、クリック、入力、画面遷移）を記録し、動画のように再生できるオープンソースのセッションリプレイツールです。再生画面ではコンソールのエラーや通信の様子もあわせて確認できるため、「フォームの送信ボタンが反応しないという問い合わせ」の原因調査など、不具合の再現にも使えます。
利用形態は大きく2つあります。
- セルフホスト：自社で用意したサーバーにOpenReplayを構築し、録画データを自社の環境に保存します。データの置き場所を自分で管理できる一方、サーバーの構築、HTTPS化、アップデート、ストレージ容量の管理、障害対応は自分の責任になります
- クラウド版：OpenReplayが運用する環境を使います。構築の手間はかかりませんが、録画データは外部サービスに保存されます
どちらを選ぶかは、扱うデータの性質と運用体制で決めます。会員情報を多く扱うサイトでデータを外部に出したくない場合はセルフホストが候補になりますが、サーバーを継続して保守できる体制があることが前提です。構築手順や推奨構成は版によって変わるため、公式ドキュメントの最新の手順に従ってください（2026年10月現在）。
導入前に決めること
セッションリプレイは、分析ツールの中でも取得する情報が多い部類です。設置前に次を決めておきます。
- 記録しない人：管理者・編集者など、ログイン中のスタッフは記録しません。運営者の操作が混ざると分析の邪魔になるうえ、管理画面の情報が映り込むおそれがあります
- 記録しないページ：
wp-admin、WooCommerceのチェックアウトとマイアカウント、会員情報の編集画面、問い合わせフォームの確認画面など、個人情報や決済情報が表示されるページはスクリプト自体を読み込まない方針にします - 同意と告知：画面操作の記録には、地域や業種によって事前同意や告知が求められます。自サイトに当てはまるルールは自社で確認し、判断に迷う場合は専門家に相談してください。プライバシーポリシーには、セッションリプレイを利用していること、記録する内容、保存期間、利用目的を記載します
トラッキングコードを子テーマから読み込む
OpenReplayの管理画面でプロジェクトを作ると、サイトに設置するトラッキングコードが表示されます。セルフホストの場合は、コードの中に自社サーバーの送信先（ingest用のURL）が含まれているかを確認してください。npmパッケージ @openreplay/tracker を使う方法もありますが、ビルド環境を持たない一般的なWordPressテーマでは、管理画面のスクリプト版を使うのが手軽です。
作業前に子テーマの functions.php をバックアップしたうえで、次の手順で設置します。
- 管理画面のトラッキングコードをコピーします
- 子テーマに
js/openreplay-tracker.jsを作り、<script>タグを除いた中身を貼り付けます functions.phpに次のコードを追加します
<?php
function my_openreplay_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;
}
// 固定ページのスラッグで除外する例（問い合わせ・会員情報など）
if ( is_page( array( 'contact', 'member-profile' ) ) ) {
return false;
}
return true;
}
function my_openreplay_enqueue() {
if ( ! my_openreplay_should_load() ) {
return;
}
$path = get_stylesheet_directory() . '/js/openreplay-tracker.js';
if ( ! file_exists( $path ) ) {
return;
}
wp_enqueue_script(
'my-openreplay',
get_stylesheet_directory_uri() . '/js/openreplay-tracker.js',
array(),
filemtime( $path ),
false
);
}
add_action( 'wp_enqueue_scripts', 'my_openreplay_enqueue' );is_page() に渡している contact と member-profile は例なので、自サイトのスラッグに置き換えてください。wp_enqueue_scripts はサイトの表側でだけ実行されるため、管理画面やログイン画面にはこのコードではトラッカーが出力されません。
ヘッダーにコードを挿入するプラグインに貼り付ける方法でも録画は始まりますが、管理者やチェックアウト画面の除外ができないため、試験的な確認にとどめるのが安全です。
入力内容と個人情報のマスキング
OpenReplayのトラッカーには、記録する内容を絞るためのオプションと、HTMLの要素単位でマスクや非表示を指定する仕組みがあります。考え方としては次の3段階で絞り込みます。
- 入力欄は既定でマスクする：トラッカーの初期化オプションで、入力欄の内容を伏せ字にする、あるいは記録しない設定を選べます。パスワード欄に加え、氏名・住所・電話番号・メールアドレスの入力欄も伏せる設定にします
- テキスト中のメールアドレスや数字を伏せる：画面に表示される文字のうち、メールアドレスや数字を伏せ字にするオプションがあります。注文番号や会員番号が表示されるサイトでは有効にしておきます
- 個人情報が表示される要素を指定する：マイページの氏名表示など特定の要素は、HTML属性を付けてマスクまたは非表示にします
オプション名や属性名は版によって変わることがあるため、ここでは名前を挙げず、OpenReplayの公式ドキュメントで「sanitization」や「privacy」の項目を確認して設定してください。設定後は、自分でフォームに入力して録画を再生し、入力内容が映っていないかを目で確認します。
録画データの保存期間も見直しの対象です。必要以上に長く保存しないことは、万一の漏えい時の影響を小さくする対策にもなります。セルフホストの場合は、録画データを保存するストレージへのアクセス制限も確認してください。
ユーザーの識別とメタデータ
トラッカーのAPIを使うと、setUserID() で録画にユーザーIDを紐付けたり、setMetadata() で会員種別などの情報を付けたりできます。問い合わせ対応で「この会員の操作を確認したい」という場面では便利ですが、メールアドレスや氏名をそのままIDにするのは避け、WordPressのユーザーIDをハッシュ化した値など、個人を直接特定しない値を使います。
ログイン中のユーザーに応じて値を出力する場合は、ログインユーザーがページキャッシュの対象外になっていることを確認してください。キャッシュされたHTMLに別の会員の値が残ると、録画が別人に紐付いてしまいます。
同意を得てから記録を始める
事前同意が必要な運用では、同意前にトラッカーを実行しない構成にします。Cookie同意バナーのプラグインの多くは、カテゴリごとにスクリプトの実行を止める機能を持っているので、トラッカーを「統計」や「分析」のカテゴリに分類します。
同意の判定はブラウザ側で行ってください。PHPで同意Cookieを判定して出力を切り替えると、ページキャッシュのHTMLが別の訪問者にもそのまま配信され、同意していない人まで記録される原因になります。
表示速度とセキュリティヘッダー
セッションリプレイのトラッカーは、ページの変化を監視して送信するため、通常のアクセス解析よりもブラウザでの処理が増えます。導入前後でPageSpeed Insightsを計測し、スマートフォンでのINPや合計ブロック時間が大きく悪化していないかを確認してください。悪化が目立つ場合は、記録対象のページを絞るのが効果的です。
サイトでContent-Security-Policyヘッダーを設定している場合は、トラッカーの配信元と送信先を許可しないと、スクリプトの読み込みや送信が止まります。キャッシュプラグインのJavaScript結合・遅延実行の対象にトラッカーが含まれていると、読み込み順が崩れることもあるため、録画が届かないときは除外対象に加えて確認します。
動作確認
ログアウトした状態、またはシークレットウィンドウで次を確認します。
- 開発者ツールのネットワークタブで、OpenReplayの送信先への通信が発生しているか
- OpenReplayの管理画面のセッション一覧に、自分の訪問が表示されるか（反映まで少し時間がかかる場合があります）
- 管理者でログインした状態と、チェックアウト・除外したページでは通信が発生しないか
- 録画を再生して、入力内容や個人情報がマスクされているか
まとめ
- OpenReplayはオープンソースのセッションリプレイで、データを自社で管理したいならセルフホスト、手軽さを重視するならクラウド版を選ぶ
- トラッキングコードは子テーマに置き、
wp_enqueue_scriptsで管理者・決済画面・個人情報を扱うページを除外して読み込む - 入力欄のマスキング、テキストの伏せ字、要素単位の非表示を設定し、録画を再生して確認する
- ユーザーIDには個人を直接特定しない値を使い、保存期間とストレージのアクセス制限も見直す
- 同意の判定はブラウザ側で行い、プライバシーポリシーへの記載、速度とCSPの確認も行う