2026年5月27日

WordPressにFullstory（DX分析）を導入する方法｜スニペット設置・ユーザー識別・プライバシー設定

SEO・パフォーマンス

WordPressにFullstoryを導入するには、Fullstoryの管理画面に表示される組織ID（Org ID）入りのスニペットを、子テーマから条件付きで <head> に読み込みます。この記事では、スニペットの設置、管理者や決済画面の除外、ユーザー識別APIとイベント送信、CSSクラスによるマスキングと除外、同意取得と表示速度への配慮、動作確認までを説明します。

Fullstoryでできること

Fullstoryは、訪問者の操作を記録して再生するセッションリプレイと、その記録をもとにした行動分析を組み合わせた、デジタル体験（DX）分析のツールです。ブランド表記は以前の「FullStory」から「Fullstory」に変わっています（2026年10月現在）。

WordPressサイトでの使いどころは、たとえば次のような場面です。

問い合わせフォームで入力をやめた人が、どの項目で止まっているかを録画で確認する
何度も同じ場所をクリックする「反応しない操作」や、エラーが出たページを洗い出す
会員サイトで、特定の会員から不具合の連絡があったときに、その人の操作を確認する

アクセス数の集計はGA4に任せ、Fullstoryは「なぜその行動になったのか」を確かめる用途に絞ると、計測の設計が重複せずに済みます。

導入前に決めること

Fullstoryは画面操作を細かく記録するため、設置前に記録の範囲を決めておくことが大切です。

記録しない人：管理者・編集者など、ログイン中のスタッフは記録しません。運営者の操作がデータに混ざるのを防ぐとともに、管理用の情報が映り込むのを避けます
記録しないページ：wp-admin、WooCommerceのチェックアウトとマイアカウント、会員情報の編集画面など、個人情報や決済情報を扱うページでは、スクリプト自体を読み込まない方針にします
同意と告知：画面操作の記録には、地域や業種によって事前同意や告知が求められます。自サイトに当てはまるルールは自社で確認し、判断が難しい場合は専門家に相談してください。プライバシーポリシーには、Fullstoryを利用していること、記録する内容、利用目的を記載します

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

ヘッダーにコードを挿入するプラグインに貼る方法でも動きますが、管理者や決済画面を除外できないため、本番では子テーマからの読み込みをおすすめします。作業前に functions.php のバックアップを取ってください。

Fullstoryの管理画面でデータ取得の設定画面を開き、Web用のスニペットをコピーします。スニペットには組織IDが含まれています
子テーマに js/fullstory-snippet.js を作り、<script> タグを除いた中身を貼り付けます
自前のイベント送信用に js/fullstory-events.js を作ります
functions.php に次のコードを追加します

<?php
function my_fullstory_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_fullstory_enqueue() {
	if ( ! my_fullstory_should_load() ) {
		return;
	}
	$dir = get_stylesheet_directory();
	$uri = get_stylesheet_directory_uri();
	if ( ! file_exists( $dir . '/js/fullstory-snippet.js' ) || ! file_exists( $dir . '/js/fullstory-events.js' ) ) {
		return;
	}

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

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

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

ユーザー識別とイベント送信

Fullstoryには、録画を特定のユーザーに紐付ける「identify」系のAPIと、任意のイベントを送るAPIがあります。現行のBrowser APIでは FS('setIdentity', …) や FS('trackEvent', …) のように関数呼び出しの形で書きますが、旧形式の FS.identify() を使った解説も多く残っています。書き方は版によって異なるため、使う前に公式の開発者向けドキュメントで現在の形式を確認してください。次の fullstory-events.js は現行形式で書いた例です。

( function () {
	if ( typeof window.FS !== 'function' ) {
		return;
	}
	// ログイン会員の識別（メールアドレスや氏名は送らない）
	if ( window.myFullstoryUser && window.myFullstoryUser.uid ) {
		window.FS( 'setIdentity', { uid: window.myFullstoryUser.uid } );
	}
	// CTA ボタンのクリックをイベントとして送る
	document.addEventListener( 'click', function ( e ) {
		if ( e.target.closest( 'a.cta-button' ) ) {
			window.FS( 'trackEvent', {
				name: 'CTA Clicked',
				properties: { page_path: window.location.pathname }
			} );
		}
	} );
} )();

ユーザー属性としてメールアドレスや氏名を送ると、管理画面で検索しやすくはなりますが、外部サービスに個人情報を渡すことになります。問い合わせ対応で会員を特定する必要がある場合でも、まずはハッシュ化した識別子とWordPress側の会員一覧を突き合わせる運用を検討してください。

CSSクラスとプライバシー設定で記録を絞る

Fullstoryでは、要素に特定のCSSクラスを付けることで記録の扱いを変えられます。

fs-exclude：その要素を記録から除外します。氏名や住所が表示される領域、決済情報の入力欄などに使います
fs-mask：要素の構造は残しつつ、文字を伏せて記録します。レイアウトは確認したいが中身は見せたくない場合に向いています
fs-unmask：マスクされる設定の中で、特定の要素だけ表示を許可します

テーマのテンプレートを編集できない部分は、管理画面のプライバシー設定でCSSセレクターを指定して除外やマスクのルールを追加できます。また、Fullstoryには文字を既定でマスクし、許可した部分だけを表示する考え方の設定もあるため、個人情報を多く扱うサイトではこちらを基本にするのが安全です。

設定後は、自分でフォームに入力したりマイページを開いたりして録画を再生し、伏せたい情報が映っていないかを目で確認してください。

同意を得てから記録する

事前同意が必要な運用では、同意が得られるまでスニペットを実行しない構成にします。Cookie同意バナーのプラグインの多くは、カテゴリごとにスクリプトの実行を止める機能を持っているので、Fullstoryを「統計」や「分析」に分類します。Fullstory側にも、読み込み時に記録を始めず、後から記録の開始・停止を指示する仕組みがあるので、同意の撤回に対応する場合は公式ドキュメントで方法を確認してください。

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

表示速度への影響

スニペットは非同期でスクリプトを読み込みますが、記録のためにページの変化を監視する処理が加わります。導入前後でPageSpeed Insightsを計測し、スマートフォンでのINPや合計ブロック時間を比べてください。悪化が目立つ場合は、記録対象のページを絞るのが効果的です。

キャッシュプラグインのJavaScript結合・遅延実行の対象にスニペットが含まれると、window.FS が未定義のまま fullstory-events.js が動くことがあります。録画が届かない場合は、2つのファイルを除外対象に加えて確認します。

動作確認

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

開発者ツールのネットワークタブで、Fullstoryへの通信が発生しているか
Fullstoryの管理画面のセッション一覧に、自分の訪問が表示されるか（反映まで少し時間がかかる場合があります）
管理者でログインした状態と、除外したページでは通信が発生しないか
会員でログインしたとき、録画に識別子が紐付いているか
fs-exclude や fs-mask を付けた部分が、録画で伏せられているか

まとめ

Fullstoryは組織ID入りのスニペットを子テーマに置き、wp_enqueue_scripts で管理者・決済画面・個人情報を扱うページを除外して読み込む
ユーザー識別やイベント送信のAPIは旧形式と現行形式があるため、公式ドキュメントで書き方を確認する
識別子には個人を直接特定しない値を使い、メールアドレスや氏名は送らない
fs-exclude・fs-mask と管理画面のプライバシー設定で記録を絞り、録画を再生して確認する
同意の判定はブラウザ側で行い、プライバシーポリシーへの記載と表示速度の確認も行う