開設
chromeの拡張
下記の拡張をいれておくと、確認等が便利になります。
Tag Assistant Legacy (by Google)
→サイト内で使用されているGTMやGA4などのプロパティがわかります
https://chrome.google.com/webstore/detail/tag-assistant-legacy-by-g/kejbdjndbnbjgmefkgdddjlbokphdefk?hl=ja
Datalayer Checker
→サイト内で出力されているデータレイヤーの内容が分かります。
https://chrome.google.com/webstore/detail/datalayer-checker/ffljdddodmkedhkcjhpmdajhjdbkogke
GA4アカウント
プロパティの作成
プロパティ名 → 任意（自身でどのサイトのGA4か分かるような名称）
レポートのタイムゾーン → 「日本」に変更
通貨 → 「日本円」に変更
お店やサービスの詳細
GA4を作成するサイトに適切な内容を選択してください。
※厳密である必要はありません。
ビジネス目標
こちらもサイトに適切な項目にチェックを入れてください。
※基本は「ユーザー行動の調査」に入れておけばよいと思います。
ECサイトであれば追加で「オンライン販売の促進」にもチェックを入れてください。
データの収集
通常のWEBサイトの計測であれば、「ウェブ」を選択しておけば大丈夫です。
ウェブサイトのURL → 計測するサイトのURL
ストリーム名 → 任意（計測されているサイトが分かるような名称）
※「○○ – GA4」といった名所にしてGA4のプロパティと分かるようにしておく
拡張計測機能 → ONにしておく
※拡張計測機能
GA4が標準で計測しているイベントも存在するが、
拡張計測機能をONにすることで、下記のイベントも計測出来るようになる。
※拡張計測は基本的にON。
・ページビュー数
・スクロール数
・離脱クリック
・サイト内検索
・フォームの操作
・動画エンゲージメント
・ファイルのダウンロード
各イベントの詳細
https://support.google.com/analytics/answer/9216061?hl=ja
実装方法
実装方法は下記の2パターンになります
・手動
・GTM（Google タグ マネージャー）
手動
手動で実装する場合は、プロパティ作成時に表示されるタグをそのまま計測サイト内に設置
GTM（Google タグ マネージャー）
GTMを利用する場合は、下記の計測IDをメモしておく
初期設定
データ保持期間
デフォルトでは「2か月」になっているため「14か月」に変更する。
また、「新しいアクティビティのユーザーデータのリセット」はONのままで大丈夫です。
※設定は「データ設定」→「データ保持」から行うことができます。
Googleシグナルの有効化
Googleシグナルを有効化することによって、スマホ→PCといったデバイスを跨ぐユーザーの行動も計測できるようになります。
※設定は「データ設定」→「データ収集」から行うことができます。
最後に「ユーザーデータ取集の確認」のボタンをチェック
クロスドメイン
ドメインをまたいでまとめて分析したいといった場合に、複数のドメインを計測できるようにするための設定します。
※「データストリーム」で対象のストリームを選択後、「タグ設定を行う」→「ドメインの設定」にて行います。
除外IPアドレス
計測を除外したいIP（自社や制作会社）からのアクセスを除外するための設定。
どのIPを除外するかを設定し、除外設定を有効化するといった2段階の操作が必要となります。
除外するIPの設定
「データストリーム」で対象のストリームをクリックし、「タグ設定を行う」→「内部トラフィックの定義」にて設定を行う。
「作成」をクリックして入力欄を表示させ、マッチタイプ→「次と等しい」、値→「(対象のIPアドレス)」を入力して「作成」をクリックする。
※「traffic_type の値」の値は、「internal」のまま
除外設定の有効化
「データ設定」→「データフィルタ」の順に進み、設定画面でフィルタの種類→「内部トラフィック」、フィルタオペレーション→「除外」で保存する。
上記が出来たら、「データ設定」→「データフィルタ」にて「フィルタを有効にする」をクリックして完了。
上記の設定で除外したIPからのアクセスは、根本的に計測されなくなるので設定の際には気を付けてください。
また、GTMを利用してのデバックも動かなくなるので、キノスラのIPが設定されていたら、一時的にIPの除外から外す必要があります。
サーチコンソール（searchconsole）との連携
searchconsole側の管理画面の「設定」→「協力者」から設定を行います。
GA4の「関連付ける」の文字をクリックし、紐づけるプロパティを選択して「続行」をクリックして完了。
関連付けが正しく設定できたら、GA4側からも確認できるようになります。
※「設定」→「Search Console のリンク」にて表示されていればOK
レポートについて
サーチコンソールを表示させる
「レポート＞ライブラリ」に移動して、Search Consoleのコレクションを公開する。
※他レポートも同様。「ライフサイクル」が表示されていなければ、「ライフサイクル」を公開にする。
eコマース
GA4が自動で収集してくれるイベントや、拡張計測機能で追加したイベント以外に、
業種ごとにGOOGLEが推奨している追加イベントがあります。
ECの場合、下記のイベントが推奨されているので、可能な限り設定するのが良いと思います。
※eコマースを入れるサイトの仕組みによってはどしても実装できないイベント等もあるため、そこはケースバイケースで。
最低限追加するeコマースイベント
下記のイベントは大体どのECサイトでも比較的入れやすいイベントになると思うので対応してください。
・view_item
→商品詳細ページを開いた時に起きるイベント
・view_cart
→カートトップを開いた時に起きるイベント
・parchase
→購入完了ページを開いた時に起きるイベント
・view_item_list
→商品一覧（だいたいはカテゴリ、もしくは検索一覧）を開いた時に起きるイベント
・select_item
→商品一覧などから商品詳細ページへ遷移するリンクを押した時に起きるイベント
・add_to_cart
→商品詳細などからカートインボタンを押した時に起きるイベント
・remove_from_cart
→カートトップなどでカート一覧から商品を削除した時に起きるイベント
・begin_checkout
→カートトップから購入フロー（配送情報やログインなど）へ遷移するリンクを押した時に起きるイベント
※各イベントの詳細＆設定パラメータ一覧
https://developers.google.com/gtagjs/reference/ga4-events?hl=ja
ユーザーID（会員番号）の連携
ECサイトが顧客ごとの一意のIDを持っている場合は、連係する。
特定のページだけとかではなく、基本、計測可能な全ページで連携させる。
データレイヤーの記述
下記データレイヤーの動作としては、
①ユーザーがログインしたら、ユーザーIDを連携する。
②cookieを利用して過去にログインしたことがあるかどうかをチェックし、過去にログインしていれば、現在のセッションでログインしていなかったとしても、ユーザーIDを連携する
<script>
var _ckUID;
var _cookiesArray = document.cookie.split('; ');
for(var ckey of _cookiesArray){
var cArray = ckey.split('=');
//console.log("key : "+cArray[0]+" / val : "+cArray[1]);
if( cArray[0] == 'ckUID'){ //任意のkey
_ckUID = cArray[1];
}
}
var _nowUID;
① _nowUID = 'ユーザーIDの置き換え文字';
if(_nowUID == "") {
if(_ckUID) {
//ログイン履歴があれば連携
window.dataLayer = window.dataLayer || [];
dataLayer.push({
② 'loginID':_ckUID;
});
}
}else{
//ログイン履歴を保持
document.cookie = 'ckUID=ユーザーIDの置き換え文字; path=/; max-age:15552000';
//ログインしてれば連携
window.dataLayer = window.dataLayer || [];
dataLayer.push({
'loginID':'ユーザーIDの置き換え文字';
});
}
</script>①については、
導入するサイト毎に仕様が異なるため、ユーザーID取得用の置き換え文字が使えるかどうか、
サイト毎に仕様を確認してください。
②については、
GTM側で「loginID」の値を受け取るデータレイヤー変数を作成しておく。
GTM側の設定
GA4の測定IDを配信している「GA4設定」の下記フィールドで、
データレイヤーで設定したユーザーIDを受け取れるように設定する。
・設定フィールド
・ユーザー プロパティ
設定フィールド
フィールド名は「user_id」を設定。
ユーザー プロパティ
プロパティ名は任意でOK。
後ほどGA4のディメンション（項目）で設定した名称を使用するので、ユーザーIDのデータが入っていると分かるような名称にする。
※ただし、「user_id」という名称はGA4のシステム側が使用している予約語となるため、「user_id」という名称は使用不可。
カスタムディメンションにユーザープロパティを登録
任意で追加した計測データをGA4のレポートで使用するためには、
カスタムディメンションの作成が必要になるため、
ユーザーIDをレポートで見るためのカスタムディメンションを追加します。
[設定]>[カスタム定義] で、 [新しいカスタム ディメンションを作成]をクリック。
[ディメンション名]には、ユーザIDだと分かりやすい名前を付けて下さい。
※既存のディメンションと名前が被らないように注意してください。
ディメンション名 → 任意（何のデータが入っているか分かるような名称にする）
範囲 → 「ユーザー」を選択
説明 → 任意
ユーザープロパティ → GTMの[GA4 設定]タグの[ユーザープロパティ]で設定したプロパティ名を入力
参照サイト
https://googleanalytics360-suite.e-agency.co.jp/column/4929
イベント実装の流れ
基本的には下記の流れで実装します。
※GTM利用前提
①計測するページに適切なデータレイヤーを設置
②GTMでタグとトリガーを設定
③GTMをプレビューにして、GA4のデバックビューで連携されている値を確認
④GTMでタグの公開
実装例：purchase（購入完了）
購入完了ページで、下記のデータレイヤーを作成。
GTMで「purchase」のイベントを取得し、GA4へとデータを連携させる。
■購入完了ページ
<script>
① window.dataLayer = window.dataLayer || [];
② dataLayer.push({ ecommerce: null }); // 前のecommerceオブジェクトを消去
dataLayer.push({
③ event: "purchase",
④ ecommerce: {
transaction_id: "T12345", //取引ID
affiliation: "Online Store", //店名など
value: "59.89", //金額合計
tax: "4.90", //税金
shipping: "5.99", //送料
currency: "EUR", //通貨
items: [{
item_name: "Triblend Android T-Shirt", //商品名 商品名もしくはIDが必須
item_id: "12345", //商品ID 商品名もしくはIDが必須
price: "15.25", //価格
item_brand: "Google", //商品のブランド
item_category: "Apparel", //商品カテゴリ
quantity: 1 //数量
}, {
item_name: "Donut Friday Scented T-Shirt",
item_id: "67890",
price: 33.75,
item_brand: "Google",
item_category: "Apparel",
item_variant: "Black",
quantity: 1
}]
}
});
</script>①②については、eコマース設定でデータレイヤーを設定する時は必ず記載する。
※データレイヤーを使用する際のルールとして、①については必ず記載する。
③計測するイベントの種類を記載
④イベントに持たせるパラメータの記載
※連携するパラメータが商品情報の場合、1つの商品に対して複数のパラメータを持つ（商品名・商品ID・価格など）ため、データ型は配列を利用する。
■GTM
GTMでトリガー（タグが実行される条件）とタグ（実行する内容）を設定する。
・トリガー
→「purchase」というイベントが起きたら実行する。
・タグ
→タグのイベントパラメータにデータレイヤーで作成しておいたデータを連携させる。
