AMPページでの計測
AMPページでの計測にGA4は2023年6月に対応しました。計測対象ページに記述を追加することで計測が行なえます。
公式ヘルプ
ページビュー計測タグ
以下の記述を計測対象ページに追加します。太字の部分は対象ストリームの測定IDを追加してください。
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
<amp-analytics type="gtag" data-credentials="include">
<script type="application/json">
{
"vars" : {
“gtag_id”: “G-XXXXXXXXXX”,
"config" : {
"G-XXXXXXXXXX": { "groups": "default" }
}
}
}
</script>
</amp-analytics>イベント計測タグ
PV計測タグにトリガーを追加して値を指定します。下記例では、CSSセレクタ「send-button」をon click（クリック）した時にイベント名:login イベントパラメータmethod、イベントパラメータ値Googleを指定しています。このようにselectorで箇所の指定を行い、イベント条件を設定する方式になります。
<amp-analytics type="gtag" data-credentials="include">
<script type="application/json">
{
"vars": {
"gtag_id": “G-XXXXXXXXX",
"config": {
" G-XXXXXXXXX ": { "groups": "default" }
}
},
"triggers": {
"button": {
"selector": "#send-button",
"on": "click",
"vars": {
"event_name": "login",
"method": "Google"
}
}
}
}
</script>
</amp-analytics>
既存イベントパラメータの上書き
PV計測タグにトリガーを追加して値を指定する。
下記例ではPV計測タグにpage_titleとpage_locationを追加し値を書き換えています。
アドレスバーのURLやタイトルが変わらない時に設定推奨です。
<amp-analytics type=“gtag” data-credentials=“include”>
<script type=“application/json”>
{
“vars” : {
“gtag_id”: “G-XXXXXXXXXXXX”,
“config” : {
“G-XXXXXXXXXXXXXX”: {
“groups”: “default”,
“page_title”: “プロフィール登録",
"page_location": "https://www.ga4.guide/profile/enter/"
}
}
}
}
</script>
</amp-analytics>