【アプリ + ウェブ プロパティ e コマースレポート登場!】 第1弾 Google タグマネージャーを使って e コマース計測を行う方法

e コマースレポートをGoogle タグマネージャーを使って計測する方法をご紹介します。
よろしければこちらもご覧ください
※この記事は読者によって投稿されたユーザー投稿のため、編集部の見解や意向と異なる場合があります。また、編集部はこの内容について正確性を保証できません。

 

Google アナリティクスの次世代のアクセス解析プラットフォーム「アプリ + ウェブ プロパティ(App + Web プロパティ)」に、待望の e コマースレポートが登場しました。
プロパティごとに順次適用されていくため、すでにご覧いただいている方もいらっしゃるのではないでしょうか。
この e コマースレポートをGoogle タグマネージャーを使って計測する方法をご紹介します。

e コマースレポートでは、サイト内の購入情報を計測できるだけでなく、商品の表示、カート追加、決済途中の離脱状況などのショッピング行動全体を詳しく分析することができます。
ただ、これらすべてを計測するためには、ECサイトの仕様に沿って適切に計測内容を設計・実装する必要があるため、それなりの手間がかかります。
そこで、まずは一番重要なデータである購入情報に絞って、ご説明いたします。

※ e コマース計測についての Google アナリティクスのヘルプは、記事執筆時点では残念ながら一部情報が不足しているところがあります。そのため、記事の一部は弊社独自の調査に基づいて記載しています。今後ヘルプが更新された場合に、本記事と内容が異なる可能性がありますのでご了承ください。

[参考ドキュメント]
Ecommerce with gtag.js | App + Web Properties | Google Developers(Last updated 2020-09-01 UTC.)
https://developers.google.com/analytics/devguides/collection/app-web/ecommerce
Ecommerce (App + Web) Developer Guide(Last updated 2020-08-07 UTC.)
https://developers.google.com/tag-manager/ecommerce-appweb

アプリ + ウェブ プロパティの e コマースデータ構造

アプリ + ウェブ プロパティで e コマースの計測をするためのデータ構造をユニバーサルアナリティクスの拡張 e コマースと比べると以下のようになります。

商品データの構造

UAキーA+Wパラメータ必須説明
iditem_id○*商品の一意の ID(SKU)
nameitem_name○*商品名
branditem_brand 商品のブランド
categoryitem_category (UA)商品が属するカテゴリ。区切り文字として「/」を使って最大 5 レベルの階層を指定
(A+W)商品のカテゴリの 1 番高いレベルまたは最上位
item_category2 商品のカテゴリの 2 番目のレベルまたは 2 番目に高いレベル
item_category3 商品のカテゴリの 3 番目のレベルまたは 3 番目に高いレベル
item_category4 商品のカテゴリの 4 番目のレベルまたは 4 番目に高いレベル
item_category5 商品のカテゴリの 5 番目のレベルまたは 5 番目に高いレベル
variantitem_variant 商品のバリエーション
affiliation このイベントが発生したショップまたはアフィリエーション
discount 商品に関連付けられた割引
couponcoupon 商品に関連付けられたクーポン
priceprice 商品の購入価格
currency 収集された価格の現地通貨
quantityquantity 指定した商品の数
dimensionXX 商品スコープのカスタムディメンション

* 商品ID または 商品名 どちらか必須。

キー/パラメータ名が異なっているほか、以下の違いがあります。

カテゴリ構造UAのカテゴリは、ひとつのキーに「/」区切りでカテゴリ階層を記述しましたが、A+Wのカテゴリは階層ごとにパラメータが分かれます。
A+Wにしかないもの商品単位のアフィリエーション、割引、現地通貨
UAにしかないもの商品スコープのカスタムディメンション

購入データの構造

UAキーA+Wパラメータ必須説明
idtransaction_idトランザクションの一意の ID
affiliationaffiliation トランザクションが発生したショップやアフィリエーション
revenuevalue イベントに関連する値(つまり収益)
currencyCodecurrency△*収集された価格の現地通貨
taxtax 税額
shippingshipping 配送料
couponcoupon 購入可能な商品に利用できるクーポンコード

* 現時点では、A+Wは「currency」パラメータを設定しないと、収益がレポートに反映されないようです。

キー/パラメータ名が異なっている以外は、違いはありません。

アプリ + ウェブ プロパティ用の e コマース購入情報 dataLayer

アプリ + ウェブ プロパティの e コマース購入情報をGoogle タグマネージャーで計測するためのdataLayerは以下のようになります。

ユニバーサルアナリティクスでは、「purchase」アクションのアクションフィールドにトランザクションの情報を記述し、「products」の配下に商品情報を記述していました。
それに対してアプリ + ウェブ プロパティでは、「purchase」の配下にトランザクションの情報を記述し、「items」の配下に商品情報を記述する形式に変わっています。

なお、アプリ + ウェブ プロパティは、ユニバーサルアナリティクスの拡張 e コマースのdataLayerとも互換性があります。互換される情報については下部で詳しく記載します。

Google タグマネージャーの設定方法

Google タグマネージャーでユニバーサルアナリティクスの拡張 e コマースを計測するには、「拡張 e コマース機能を有効にする」「データレイヤーを使用する」の二つのチェックボックスにチェックを入れるだけ、ととてもシンプルな設定内容でした。
アプリ + ウェブ プロパティ用のGTMタグには、まだそのような機能は用意されていないため、必要な情報を取得する変数を作成し、イベントとパラメータを送信するタグを作成する必要があります。
また、ユニバーサルアナリティクスのように、ページビューのヒットとセットで e コマース情報を送信することはできないため、e コマース情報を送信するためのイベントを専用で用意する必要があります。

トランザクションIDなど、トランザクションの情報を取得する変数は以下のように設定します。

商品情報を取得する変数は以下のように設定します。

これらの変数を利用して、購入情報を送信するタグは以下のようになります。
「purchase」というイベント名で送信する必要があります。

トリガーについては、アプリ + ウェブ プロパティ用のものがあるわけではないので、dataLayerが出力されるタイミングに合わせて、適したものを指定してください。

e コマースの送信データ

Google タグマネージャーの設定が完了したら、動作の確認です。
ブラウザの開発者ツールなどを利用して、Google アナリティクスに送信されるデータ(ペイロード。ビーコンと呼ぶこともある)を確認すると、以下のような形式になっています。

ユニバーサルアナリティクスでは商品情報の各項目ごとにパラメータが分かれていましたが、アプリ + ウェブ プロパティでは1商品のパラメータの中に「~」でつないだ形で送信されています。

アプリ + ウェブ プロパティとユニバーサルアナリティクスの両方(デュアルタギング)で利用する方法

アプリ + ウェブ プロパティはまだβ版ということもあり、ユニバーサルアナリティクスと併用して(デュアルタギングで)ご利用されていることが多いのではないでしょうか。
そこで、アプリ + ウェブ プロパティとユニバーサルアナリティクスの両方に e コマース情報を送信する方法を、2パターンご案内します。

① アプリ + ウェブ プロパティとユニバーサルアナリティクスのdataLayerを併記する

アプリ + ウェブ プロパティは、ユニバーサルアナリティクスの拡張 e コマースのdataLayerとも互換性がありますが、「データ構造」の章でご説明したように構造に違いがあります。
アプリ + ウェブ プロパティの機能をフルに活用いただくためには、アプリ + ウェブ プロパティ用のdataLayerをサイトに設置することをお勧めいたします。

アプリ + ウェブ プロパティとユニバーサルアナリティクスのdataLayerは、サイト上に併記することができます。

ただし注意点として、

1. アプリ + ウェブ プロパティのdataLayer
2. ユニバーサルアナリティクスのdataLayer
3. Google タグマネージャー コンテナスニペット

の順序で記載してください。

ユニバーサルアナリティクスのdataLayerの方が上になっていると、「拡張 e コマース機能を有効にする」「データレイヤーを使用する」のチェックボックスで計測している場合に、商品情報が正しく取得できなくなってしまいます。

タグの併記例

Google タグマネージャーの設定は、ユニバーサルアナリティクス用のものは変更する必要ありません。
アプリ + ウェブ プロパティ用のものは、前述の「Google タグマネージャーの設定方法」に沿って行ってください。

② ユニバーサルアナリティクスのdataLayerだけで、アプリ + ウェブ プロパティにもデータを送信する

dataLayerを新しく設置することは、サイトの運用面で容易ではないことがあります。とくに購入完了ページはECシステムが関係するため、なかなか難しいことも多いのではないでしょうか。
そういう場合は、既存のユニバーサルアナリティクスのdataLayerを使ってデータを送信することも可能です。
ただし、アプリ + ウェブ プロパティにしかない項目を送信することは難しいです。また、商品のカテゴリは、第1階層にすべてのカテゴリ情報がセットされます。

トランザクションIDなど、ユニバーサルアナリティクスのアクションフィールドの情報を取得する変数は以下のように設定します。

ユニバーサルアナリティクスの商品情報を取得する変数は以下のように設定します。

これらの変数を利用して、購入情報を送信するタグは以下のようになります。

この方法で送信すると、カテゴリ情報は以下のようにレポートに表示されます。

これを階層ごとに分けたい場合は、カスタムjavascript変数を使って「/」で分割する必要があります。また、複数商品の情報を処理して「items」にセットするためにもカスタムjavascript変数が必要です。いささか難しい処理になるため、javascriptの知識をお持ちの方が設定することをお勧めします。

以上、アプリ + ウェブ プロパティの e コマースレポートに、 Google タグマネージャーを使って購入情報を送信する方法をご説明いたしました。

次回は、計測した e コマース情報が、Google アナリティクスのレポートでどのように表示されるかをご案内する予定です。

イー・エージェンシーでは、購入情報だけでなく、この記事でご紹介していないショッピング行動全体の計測・分析をお手伝いすることも可能です。
ご興味をお持ちになった方は、お気軽にイー・エージェンシーまでお問い合わせください!

Google Marketing Platform導入・活用支援サービス
https://googleanalytics360-suite.e-agency.co.jp/

株式会社イー・エージェンシー
https://www.e-agency.co.jp/

特集記事
【アプリ + ウェブ プロパティに e コマースレポート登場!】第2弾 e コマースレポートの見方と確認できるデータ<標準レポート編>

https://googleanalytics360-suite.e-agency.co.jp/blog/2564/
アプリ + ウェブ プロパティの e コマースレポートで、Google タグマネージャーを使って計測したデータがどのように表示され、確認できるのか? e コマースレポートの見方と確認できるデータ、拡張 e コマースとの違いについて、わかりやすくご紹介しています。

よろしければこちらもご覧ください
この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

Web業界の転職情報

もっと見る
Sponsored by

人気記事トップ10(過去7日間)

今日の用語

トップレベルドメイン
インターネットのDNSで利用されるドメイン名のドット(.)以降に示される文字列。 ...→用語集へ

連載/特集コーナーから探す

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]