背景
今回業務の中であるフォームの離脱ポイントの調査のために探索レポートの作成していました。その中でデータを探索レポートで使用できるようにするまでの過程でとても苦労したので、実装内容(データ送信〜レポートでデータを使用できるようになるまで)を記録としてまとめます。
googleアナリティクスとは
Google アナリティクスは、ウェブサイトやアプリのアクセス解析ツールです。具体的にはユーザーの行動、流入経路、コンバージョン率などを分析し、マーケティングやサイト改善に活用できます。
探索レポートとは
探索レポートは、Google アナリティクス4の高度なデータ分析ツールで、カスタマイズしたデータの可視化や詳細なユーザー行動の分析が可能です。
設定方法
本記事はすでにアナリティクスアカウントを持っている前提で説明をします。
また今回はフォームの離脱ポイントを調べる探索レポートの作成を例に説明していきます。
1. headタグ内に下記のコードを設置
これはデータをアナリティクスで設定する「gtag();」を使用できるようにするための設定です。
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){ dataLayer.push(arguments); }
gtag('js', new Date());
// Google アナリティクスのトラッキング ID を設定
gtag('config', 'G-XXXXXXXXXX');
</script>
#G-XXXXXXXXXX(トラッキングID)は置き換えてください。
GoogleアナリティクスのトラッキングIDの確認方法
1. Google アナリティクスにログイン
Google アナリティクス にアクセスし、ログインします。
2. プロパティを選択
トラッキングしたい ウェブサイトのプロパティ を選択します。
3. 管理画面を開く
左下の 「管理」(歯車アイコン ⚙️)をクリック。
4. データストリームを開く
[データストリーム] をクリック。
設定済みの ウェブサイトのデータストリーム を選択。
5. 測定 ID(G-XXXXXXXXXX)を確認
画面の右上あたりに「測定 ID」(G-XXXXXXXXXX) が表示されています。
2. gtagの設置
設置方法はとても簡単で、送信したいタイミングに下記のコードを設置するだけです。
今回はプロジェクトのJavaScriptのファイルに記述します。
「sample」「sample_formLabel」「sample_value」「label」「value」は自由に変更が可能です。
※データ名は探索レポートで使用する際に「-(ハイフン)」の名前は使用できないため、「_」を使いましょう。
gtag('event', 'form_submission', { // イベント名(自由に設定)
'form_label': label, // フォームのラベル
'form_value': value // 入力された値
});
3. パタメータ確認
実際にイベントを発火させてパラメータ送信を行いましょう。
送信後はアナリティクスに戻り「リアルタイムレポート」を開きます。
その中で「イベント数(イベント名)」という項目があります。
その中で先ほど設定した「sample」という名前のイベントが入っているはずです。
もしデータが来ていない場合には、パラメータを何件か送信してから確認してみてください。
※それでも届いていない場合には、「トラッキングID」が正しく設定されているか、gtagが機能しているか検証ツールのNetworkからリクエストが出ているか確認してみてください。
ただ、ここからがGoogleアナリティクスの煩わしいところなのですが、このパラメータを探索レポートで使用できるようにするには「カスタム定義」にてパラメータをカスタムディメンションとして登録する必要があります。
しかし、登録するにはこの送信したパラメータ(sample_formLabel、sample_valueなど)をGoogleアナリティクスに認知させる必要があります。
ただ、この認知には24〜48時間かかります、、。
認知させる方法はとにかく待つこと!!!!
いろいろ調べましたが、この間は特にやれることはありません。
大人しく別のことをして待機しましょう。
理由はデータ収集の仕組みと、探索レポートでのデータ利用の仕組みが異なるとのことです。
参照ページ:https://support.google.com/analytics/answer/14240153?hl=ja
4. カスタム定義
次にパラメータを探索レポートで作成できるようしていきます。
2日かけてパラメータが認知されるようになったら、カスタム定義からカスタムディメンションが設定できるようになります。
※送信したイベントが認識されない場合は、リアルタイムレポートで正しくデータが送信されているかを確認しましょう。
このカスタムディメンションは、探索レポートで使用できるデータ項目です。
ここで注意ですが、カスタムディメンションは一度設定すると削除できないため、適切な命名規則を考えた上で登録しましょう。
問題なければ早速検索からカスタム定義を検索して設定画面へ行きましょう。
ここの「カスタムディメンション作成」をクリックし、登録画面を開きます。
開けたら、イベントパラメータから設定したデータが設定できるようなっているはずです。
先ほどの例で言うと「sample_formLabel」「sample_value」が設定できるはずです。
※ここでデータが表示されない場合は、「データ名にハイフンをつかっていないか」「データのテスト送信をしてから2日ほど経っているか」をチェックしてみてください。
gtag('event', 'sample', {
'sample_formLabel': label,
'sample_value': value
});
次にディメンション名を入力したら保存を押します。
ディメンション名が適切にカスタムディメンションの一覧に出ていれば保存完了です。
では早速探索レポートを作成していきたいところですが、またもやこのカスタムディメンションを探索レポートで使用するにはGoogleアナリティクスにカスタムディメンションを認知させる必要があります。
この認知にはまた24〜48時間かかります、、。
認知させる方法はとにかく待つこと!!!!
いろいろ調べましたが、この間は特にやれることはありません。
大人しく別のことをして待機しましょう。
レポート作成
カスタムディメンションを登録してgoogleアナリティクスにも認知されたらやっと探索レポートを作成できます。
そうすると下記のような画面があります。
今回は自由形式で作成していきます(途中変更可能)。
自由形式をクリックすると写真のような画面にいきます。
ここでは仮のデータが入っていますが削除して問題ありません。
ここの「変数」で作った「カスタムディメンション」を設定します。
ここで設定されている内容は全て削除してしまって問題ありません。
ではディメンションの横にある「+」をクリックします。
ここのカスタムをクリックすると「sample_formLabel」「sample_value」が選択肢として出てきます。ここで選択をして「確定」をクリックするとカスタムディメンションを探索レポートで使用できるようになります。
まとめ
今回はGoogleアナリティクス4の探索レポートを活用し、データ送信からカスタムディメンションの設定、探索レポートでの可視化までの流れを詳しく説明しました。その中でも特にデータ認識に時間がかかることがわかっていただけたと思います。
試行錯誤をしながら設定をすると大幅に時間をロスしてしまいます。
そのため、本記事を読んで効率的に探索レポートを作成できるようにしていきましょう。