このプラグインは、Google Tag Manager(GTM)経由でGoogle Analytics(GA4)を管理し、eコマースタグ設置をサポートします。通常のeコマース計測はもちろん、実装が難しい決済プロセスのタグ設定もこのプラグイン一つで対応可能です。さらに、User IDレポート、サイト内プロモーション計測など、高度な分析機能も提供します。
(Google Tag Manager公式サイトより引用:https://www.google.com/intl/ja/tagmanager/features.html)
Googleタグマネージャは、無料で簡単に使用できるタグ管理システムです。ウェブ上の使いやすい管理画面から自分でタグを管理してモバイルアプリを設定できるため、面倒なコードの書き換えは不要で、IT部門に依頼する必要もありません。
(Google Developersより引用: https://developers.google.com/analytics/devguides/collection/ga4/ecommerce?hl=ja)
これらのイベントを実装することにより、人気商品を定量化し、プロモーションや商品の配置が売上に与える影響を把握できます。
プラグインの設定手順
このプラグインの設定にはGTMの知識が必要です。設定に困る場合は、有償の設置代行サービスも提供していますので、お気軽にご相談ください。
EC-CUBEオーナーズストアでプラグインを購入し、インストール後、以下の設定を行います。
[基本設定]
[基本設定]
・コンテナID: GTMのコンテナID(GTM-で始まるID)を設定します。(取得方法は後述の付録を参照)
・GTMコンテナタグ: 自身でコンテナタグを設置している場合や、他のプラグインでGTMタグを設置している場合のみ、「コンテナタグを挿入しない」を選択してください。
・出力するタグの種類: GA4を選択してください(UAのオプションは旧バージョンとの互換性のためのみにあります。UAタグを出力してもGA4では計測できません)
・拡張eコマース/eコマース: 拡張eコマースを選択してください
[オプション]
・カテゴリ名: カテゴリ名のトラッキング方法を選択します。「カテゴリ名を含める」を選択すると、計測時に商品カテゴリ名を含めます。
注意点
・GA4への計測beacon長の制限により、カテゴリ名を含めていると計測がうまくいかないケースがあります。その場合は「カテゴリ名を含めない」を選択してください。
[高度な設定]
[高度な設定]
・ユーザーIDトラッキング: 「User-IDビュー」を利用する場合は、有効にしてください。
・カスタム速度:(旧バージョン互換オプションです。無視してください)
・インプレッション計測: 関連商品、商品カテゴリ、検索結果、お気に入りなどでの商品表示をインプレッションとして計測する場合は、有効にしてください。
・カスタムリファラトラッキング: 必要に応じて設定してください。
本プラグインで eコマース/拡張eコマースを実施するためには以下の準備が必要です。
1. Google Tag Manager
Google Tag Manager がないと、eコマース/拡張eコマースタグを発行することができません。まだ アカウントを持っていない人は、
ここからアカウントを開設してください。
2. GA4タグ設定
まず、GA4の設定タグを作成します。
・名前: Google Analytics: GA4 Configuration
・タグの種類: Google Analytics: GA4 Configuration
・測定ID: GA4の測定IDを設定します。
・フィールド名:
・user_id: {{GA4 user_id}} ※後述①
・debug: true (デバッグモードを有効にする場合は設定)
・トリガー: すべてのページ
① user_idというデータレイヤー変数を用意し、この値を上記GA4タグのuser_idフィールドに設定します。この変数は、ユーザーIDトラッキングを行う場合に必要です。

user_id という DataLayer 変数を用意し、これを上記GA4タグの user_id フィールドの値としてください。
3. dataLayer を設定
以下の5つのデータレイヤー変数を作成します。これらの変数は、eコマースイベントのデータをGA4に送信するために使用されます。

名前: GA4 dataLayer ecommerce.items
変数の種類: データレイヤー変数
データレイヤーの変数名: ecommerce.items

名前: GA4 dataLayer ecommerce.shipping
変数の種類: データレイヤー変数
データレイヤーの変数名: ecommerce.shipping

名前: GA4 dataLayer ecommerce.tax
変数の種類: データレイヤー変数
データレイヤーの変数名: ecommerce.tax

名前: GA4 dataLayer ecommerce.transaction_id
変数の種類: データレイヤー変数
データレイヤーの変数名: ecommerce.transaction_id

名前: GA4 dataLayer ecommerce.value
変数の種類: データレイヤー変数
データレイヤーの変数名: ecommerce.value
4. トリガーを設定

以下の6つのトリガーを作成します。これらのトリガーは、eコマースイベントが発生した際にGA4イベントタグを発火させるために使用されます。

名前: GA4 - view_item_list
トリガーの種類: カスタムイベント
イベント名: view_item_list

名前: GA4 - view_item
トリガーの種類: カスタムイベント
イベント名: view_item

名前: GA4 - add_to_cart
トリガーの種類: カスタムイベント
イベント名: add_to_cart

名前: GA4 - begin_checkout
トリガーの種類: カスタムイベント
イベント名: begin_checkout

名前: GA4 - confirmation
トリガーの種類: カスタムイベント
イベント名: confirmation

名前: GA4 - purchase
トリガーの種類: カスタムイベント
イベント名: purchase
5. GA4イベントタグ設定

計測したいイベントごとにタグを作成します。ここでは、以下の6つのイベントの計測タグを追加する例を示します。
・view_item_list
・view_item
・add_to_cart
・begin_checkout
・confirmation
・purchase
各イベントタグの設定は以下のとおりです。

名前: GA4 Event - [イベント名] (例: GA4 Event - view_item_list)
タグの種類: Google Analytics: GA4 Event
構成タグ: 手順2で作成した「Google Analytics: GA4 Configuration」を指定
イベント名: [イベント名] (例: view_item_list)
パラメータ:
items: {{GA4 dataLayer ecommerce.items}}
トリガー: GA4 - view_item_list

名前: GA4 Event - [イベント名] (例: GA4 Event - view_item)
タグの種類: Google Analytics: GA4 Event
構成タグ: 手順2で作成した「Google Analytics: GA4 Configuration」を指定
イベント名: [イベント名] (例: view_item)
パラメータ:
items: {{GA4 dataLayer ecommerce.items}}
トリガー: GA4 - view_item

名前: GA4 Event - [イベント名] (例: GA4 Event - add_to_cart)
タグの種類: Google Analytics: GA4 Event
構成タグ: 手順2で作成した「Google Analytics: GA4 Configuration」を指定
イベント名: [イベント名] (例: add_to_cart)
パラメータ:
items: {{GA4 dataLayer ecommerce.items}}
トリガー: GA4 - add_to_cart

名前: GA4 Event - [イベント名] (例: GA4 Event - begin_checkout)
タグの種類: Google Analytics: GA4 Event
構成タグ: 手順2で作成した「Google Analytics: GA4 Configuration」を指定
イベント名: [イベント名] (例: begin_checkout)
パラメータ:
items: {{GA4 dataLayer ecommerce.items}}
トリガー: GA4 - begin_checkout

名前: GA4 Event - [イベント名] (例: GA4 Event - confirmation)
タグの種類: Google Analytics: GA4 Event
構成タグ: 手順2で作成した「Google Analytics: GA4 Configuration」を指定
イベント名: [イベント名] (例: confirmation)
パラメータ:
items: {{GA4 dataLayer ecommerce.items}}
トリガー: GA4 - confirmation

名前: GA4 Event - purchase
タグの種類: Google Analytics: GA4 Event
構成タグ: Google Analytics: GA4 Configuration
イベント名: purchase
パラメータ:
items: {{GA4 dataLayer ecommerce.items}}
shipping: {{GA4 dataLayer ecommerce.shipping}}
tax: {{GA4 dataLayer ecommerce.tax}}
transaction_id: {{GA4 dataLayer ecommerce.transaction_id}}
value: {{GA4 dataLayer ecommerce.value}}
currency: JPY
トリガー: GA4 - purchase
上記の設定が完了したら、GTMタグを公開してください。
NOTE:
v2.2.0 より追加された mypage, mypage_login, sign_up, sign_up_confirm, sign_up_initiated, shopping_login, shopping_nonmember イベントはそれぞれ以下のページの dataLayer に盛り込まれております。GTMに設定して計測にご利用くださいませ。
ログイン完了の計測も可能です。ただしこちらは GTM 上の開発が伴うため有償対応としております。お気軽にご相談ください。
Event名 | URL | ノート |
---|
mypage | /mypage | マイページ表示 |
mypage_login | /mypage/login | 通常のログインページ表示 |
sign_up | /entry/complete | 新規会員登録 完了 |
sign_up_confirm | /entry | 新規会員登録 入力内容確認 |
sign_up_initiated | /entry | 新規会員登録ページ表示 |
shopping_login | /shopping/login | 購入からのログインページ表示 |
shopping_nonmember | /shopping/nonmember | ゲスト購入ページ表示 |