WordPress・Shopify・STUDIOにGA4とGTMを入れる:サービスごとの入れ方

公開 更新 書いた人 大林 諒

Googleアナリティクス4(GA4)とGoogleタグマネージャー(GTM)のコードは、サイトを作っているサービスによって入れる場所が違います。WordPressはテーマかプラグイン、Shopifyはアプリかカスタムピクセル、STUDIOは管理画面の「Apps」です。3つのサービスの入れ方を並べ、消えにくく二重に数えない入れ方を決めます。読み終わると、どの方法を選び、どこを確かめるかが決まります。GA4のプロパティと測定ID、GTMのコンテナはできている前提です。作り方は「GA4の導入手順:アカウント・プロパティ・データストリームを作って測定IDを入れる」と「GTMの導入と初期設定:コンテナを作ってサイトに入れ、GA4タグを1つ置く」に書いています。

例は全記事共通の「サンプル料理教室」です。予約制の小さな料理教室で、ホームページ sample-cooking.example はWordPressで制作会社が作りました。テーマの直しは制作会社に頼み、GTMの中はこちらで触ります。ShopifyとSTUDIOの節は、同じ教室が別のサービスを使っていたら、として書きます。画面やプランの名前は2026年10月時点のものです。

この記事の内容
  1. 先に決めること
  2. サービスごとの入れ方の比較
  3. WordPressに入れる
  4. Shopifyに入れる
  5. STUDIOに入れる
  6. サービス独自のアクセス解析とGA4を両方見る意味
  7. 応用
  8. できないことと、その代わり
  9. よく詰まるところ
  10. 次にやること

先に決めること

ここを決めずにコードを入れると、ページビューが2倍になったり、テーマを変えた翌日から計測が止まったりします。

GA4を直接入れるか、GTMの中で入れるか

GA4は測定IDのコード(Googleタグ)を直接入れても、GTMのコンテナを入れてその中でGoogleタグを置いても動きます。電話タップやLINE追加のボタンもあとで数えるなら、GTMのコンテナだけをサイトに入れ、GA4はGTMの中で置く形にそろえます。サイトに入れるコードが1種類になり、あとから足すタグはGTMの画面だけで済むからです。サンプル料理教室はこの形にします。

STUDIOだけは事情が違い、GA4は「Apps」で直接つなぐほうが公式のおすすめです。理由はSTUDIOの節に書きます。

入れる場所を1か所に決める

同じGA4の測定IDが2か所から読み込まれると、同じページビューが2回送られます。WordPressならテーマの設定欄とプラグイン、ShopifyならGoogle & YouTube アプリとカスタムピクセル、STUDIOなら「Apps」と「カスタムコード」が重なりやすいところです。新しく入れる前に、いま入っている場所を全部洗い出し、最後に1か所だけ残すと決めておきます。

テーマやサイトの中を誰が触るか

サンプル料理教室では、テーマのファイルを直すのは制作会社で、こちらは管理画面でプラグインを入れる・GTMの中を触る、までです。テーマのファイルに手を入れられないなら、プラグインで入れる方法を選びます。

サービスごとの入れ方の比較

2026年10月時点の各社の公式ヘルプによる一覧です。

サービス入れ方GA4GTM向く場面注意
WordPressテーマの header.php に直接貼る入れられる入れられる一時的な確認テーマの更新・変更で消える。ブロックテーマには header.php が無い
WordPress子テーマの functions.php でフックに足す入れられる入れられる制作会社が子テーマで管理している親テーマの更新では消えないが、別のテーマに替えると消える
WordPressSite Kit by Google入れられる入れられるGA4とSearch Consoleの数字をWordPressの管理画面でも見たい同じプロパティのタグがすでにあるときだけ、自動でGA4のコードを置かない設定になる
WordPressGTM4WP入れない(GTMの中で置く)入れられるGTMで計測をまとめたい2つ目のコードはテーマの対応次第で置かれる位置が変わる
ShopifyGoogle & YouTube アプリ入れられる入れないストアの基本的な計測をコードなしで始めたいGoogle広告・Merchant Centerともつながる
Shopifyカスタムピクセル入れられる入れられるチェックアウトまでGTMで計測したいサンドボックスの中で動く。JavaScriptの知識が要り、Shopifyのサポート対象外
STUDIO「Apps」の「Google Analytics」入れられる入れないGA4だけ入れたいMiniプラン以上の有料プラン。公開済みのサイトは「更新」が要る
STUDIO「Apps」の「Google Tag Manager」入れない(GTMの中で置く)入れられるボタンのクリックを数えたいAppsとカスタムコードにGTMを両方入れると正しく動かない
STUDIOカスタムコード入れられる入れられるAppsに無いタグを入れたい有料プラン。サイト全体か、ページごとに head・body へ入れる
WordPressの「プラグイン」→「新規追加」でGTM4WPとSite Kit by Googleを検索した結果
WordPressの「プラグイン」→「新規追加」でGTM4WPとSite Kit by Googleを検索した結果

WordPressに入れる

テーマを変えたときにタグが消える理由

WordPressの見た目はテーマが決めています。ページの <head> を出力しているのはテーマの header.php で、ここに直接GA4やGTMのコードを貼ると、そのコードはテーマのファイルの一部になります。テーマを別のものに替えれば、新しいテーマの header.php にはそのコードが入っていないので、計測は止まります。同じテーマでも、テーマの作者が更新を出して適用すると header.php は新しいファイルで上書きされ、貼ったコードは消えます。WordPressの公式のテーマ開発ハンドブックも、親テーマを直接直すと更新で変更が失われると書いています。

テーマが独自に持っている「測定ID」の設定欄も同じです。値はテーマの設定として保存されるので、テーマを替えると読まれなくなります。実際に運用していると、リニューアルでテーマが替わり、公開した日からGA4のページビューが0になっていた、という形がいちばん多く起きます。

最近のWordPressの標準テーマはブロックテーマで、ヘッダーはブロックで組まれた parts/header.html というファイルになっています。header.php が無いので、昔の解説どおり「header.php に貼る」ことがそもそもできません。

テーマを替えても、更新してもタグを残すには、次のどちらかにします。

  • 子テーマの functions.php から、WordPressのフックでコードを足す(親テーマの更新では消えない)
  • プラグインでコードを入れる(テーマを替えても消えない)

子テーマで残す

子テーマは、親テーマの見た目と機能を引き継いだまま、自分の変更だけを別のフォルダに持つ仕組みです。親テーマが更新されても、子テーマのフォルダは上書きされません。最低限必要なのは wp-content/themes に作るフォルダと、その中の style.css です。style.css の先頭に、親テーマのフォルダ名を Template: で書きます。

/*
Theme Name: Sample Cooking Child
Template: parent-theme
*/

parent-theme は親テーマのフォルダ名に置き換えます。1文字違うと子テーマになりません。

GTMのコードは、子テーマの functions.php に、head の出力時に動く wp_head と、body の開始タグの直後に動く wp_body_open の2つのフックで足します。header.php を子テーマにコピーして直すと、親テーマが header.php を直したときに子テーマ側が古いまま残るので、フックのほうが後が楽です。

<?php
// 子テーマの functions.php に追記する。
// すでに先頭に <?php がある場合は、この1行目は書かない。

add_action( 'wp_head', function () {
	?>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->
	<?php
}, 1 );

add_action( 'wp_body_open', function () {
	?>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
	<?php
} );

wp_head の最後の 1 は優先度で、小さいほど先に出力されます。GTMの1つ目のコードは head のできるだけ上に置く指定なので、小さい値にしています。wp_body_open はWordPress 5.2で追加されたフックで、テーマが body の直後でこれを呼んでいないと2つ目のコードは出ません。2つ目はJavaScriptを止めている人向けの予備なので、出なくてもGA4の計測はほぼ変わりません。

子テーマで守れるのは親テーマの更新までで、別のテーマに替えればこのコードも外れます。テーマが替わる予定があるなら、次のプラグインの方法を選びます。

プラグインで残す(Site Kit by Google と GTM4WP)

プラグインで入れたコードは、テーマを替えても残ります。GA4とGTMで使われる代表的なプラグインは次の2つです。

Site Kit by Google はGoogleの公式プラグインで、GA4やSearch Consoleの数字をWordPressの管理画面で見られるようにします。プロパティやコンテナを選ぶと、必要なコードをSite Kitが置きます。サイトにすでに同じプロパティのタグがあると、二重にならないよう自動でコードを置かない設定になります。違うプロパティのタグが残っていると、両方のプロパティにデータが送られます。

GTM4WP は、GTMのコンテナのコードを入れ、ページの種類・カテゴリ・ログインの有無などをデータレイヤーに送るプラグインです。1つ目のコードは全ページの <head> に自動で入ります。2つ目のコードの置き場所は「互換モード(compatibility mode)」の設定で決めます。WordPress 5.2の仕組み(wp_body_open)に対応したテーマなら、互換モードをオフにしておけば body の直後に自動で置かれます。対応していないテーマでは、おすすめはされていないものの動く「Footer」か、自分でPHPに書く「Manually coded」を選びます。

どちらを選ぶかは、GA4をGTMの中で置くかどうかで決まります。

やりたいこと選ぶものGA4のGoogleタグを置く場所
GA4だけ入れ、WordPressの管理画面でも数字を見たいSite Kit(アナリティクス)Site Kit
GTMでボタンやフォームも数えたいGTM4WPGTMの中
GTMで数えつつ、WordPressの管理画面でもGA4とSearch Consoleを見たいGTM4WP + Site KitGTMの中(Site Kitの「Place Google Analytics code」はオフ)

3つ目でSite KitにもGA4のコードを置かせると、GTMの中のGoogleタグと二重になるので、Site Kitのアナリティクスの設定でコードを置くスイッチを切ります。

サンプル料理教室での手順

サンプル料理教室は、制作会社のテーマのファイルには触らず、GTM4WPでGTMのコンテナを入れ、GA4はGTMの中で置きます。テーマのリニューアルがあっても計測が止まらない形です。

  1. ブラウザで sample-cooking.example のトップを開き、ページのソースを表示して G- と GTM- で検索する。見つかったIDと、テーマの設定欄・プラグイン・header.php のどこから出ているかを書き出す。
  2. 制作会社に、テーマやテーマの設定欄にGA4やGTMのコードを入れているかを聞き、入っていれば外してもらう日を決めておく(外すのは手順8)。
  3. WordPressの管理画面で「プラグイン」→「新規追加」を開き、「GTM4WP」で検索して「今すぐインストール」→「有効化」を押す。
  4. 「設定」→「Google Tag Manager」を開き、「Google Tag Manager ID」に GTM-XXXXXXX を入れて保存する。
  5. 同じ画面の互換モード(compatibility mode)をオフのままにし、ページのソースで ns.html?id=GTM-XXXXXXX が <body> の直後に出ているかを見る。出ていなければ互換モードで「Footer」を選ぶ。
  6. GTMで、測定ID G-XXXXXXXXXX のGoogleタグを、トリガー「Initialization – All Pages」(ヘルプの日本語表記は「初期化 – すべてのページ」)で置く。手順1で見つかったGA4のコードがまだ動いているので、ここでは公開しない。
  7. GTMの「プレビュー」で sample-cooking.example につなぎ、GoogleタグがGTMから発火していることと、GA4のDebugViewにページビューが届くことを確かめる。
  8. 制作会社に、テーマ側のGA4のコードを外してもらう。外れたのをソースで確かめた直後に、GTMの「公開」を押し、「バージョンの公開と作成」を選んで公開する。
  9. 翌日、GA4の「レポート」でページビューを前の週の同じ曜日と比べる。2倍近ければまだどこかに残っている、半分近ければどこかで止まっている。

手順8で外すのと公開を続けて行うのは、間が空くとその間のページビューが2倍か0になるからです。

GTM4WPの設定画面で「Google Tag Manager ID」にコンテナIDを入れたところ
GTM4WPの設定画面で「Google Tag Manager ID」にコンテナIDを入れたところ
ページのソースで GTM- を検索し、head と body の直後にコードが出ているところ
ページのソースで GTM- を検索し、head と body の直後にコードが出ているところ

Shopifyに入れる

入れ方は2つ

ShopifyでGA4を入れる公式の入口は、Googleが提供している Google & YouTube アプリです。Shopifyのヘルプは、GA4のプロパティとウェブのデータストリームを作り、このアプリを入れてGoogleタグを設定する順で案内しています。アプリは無料で入れられ、Merchant Centerにつながなくても設定できます。

GTMで入れたい場合は、Shopifyの管理画面の「設定」→「Customer events」で、カスタムピクセルとしてGTMのコードを入れます。どちらか一方にします。両方でGA4に送ると、ページビューも購入も2回数えられます。

比べるところGoogle & YouTube アプリカスタムピクセル(GTM)
必要な知識コード不要JavaScriptとGTMのデータレイヤー
サポートアプリはGoogleが提供Shopifyのサポート対象外
計測できるものアプリが用意した範囲Shopifyの標準イベント(ページ表示・商品表示・カート追加・チェックアウト開始・購入完了など)を自分で選んで送る
向く会社まずGA4と広告を始めたい購入以外の独自のイベントもGTMでまとめて管理したい

チェックアウトでカスタムピクセルを使う理由

以前は、チェックアウトの計測のために、チェックアウトの設定の「追加スクリプト」や checkout.liquid(Shopify Plusのみ)にコードを貼っていました。Shopifyの開発者向けドキュメントでは、サンクスページと注文状況ページの checkout.liquid と追加スクリプトは2025年8月28日に終了し、Plus以外のストアのスクリプトタグも2026年8月26日に終了しています。チェックアウトの設定の追加スクリプトは、2025年8月28日から表示のみで編集できません。

いまチェックアウトで計測する正規の入口がピクセルです。Shopifyのヘルプは、カスタムピクセルについて、テーマのコードを直さずに、チェックアウトや購入後のページのように他の方法では届きにくいページでも顧客のイベントを集められる、と書いています。ピクセルはストアのほかの部分から切り離されたサンドボックスの中で読み込まれ、第三者に送るデータの安全と管理がしやすくなります。

チェックアウトに直接コードを貼る道はShopifyが閉じていて、残っているのがピクセルだということです。GA4で購入(purchase)を数えるなら、アプリのピクセルかカスタムピクセルを使います。

カスタムピクセルでGTMを入れる手順

Shopifyのヘルプにある手順を、GA4の推奨イベントの名前に合わせて書き直した例です。

  1. 先に、theme.liquid やチェックアウトの設定の追加スクリプトに残っている古い計測のコードを外す(Shopifyのヘルプも、二重に数えないよう先に外すよう書いている)。
  2. Shopifyの管理画面で「設定」→「Customer events」を開く(ヘルプの英語表記。日本語の画面では訳語で出る)。
  3. カスタムピクセルの名前(例: GTM)を付け、「Add pixel」を押す。
  4. 「Code」の欄に、下のコードを貼る。GTMのインストール画面の head 用のコードから <script> と </script> を外したものが前半になる。
  5. 「Save」を押し、続けて「Connect pixel」を押す。
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');

analytics.subscribe("page_viewed", (event) => {
  window.dataLayer.push({
    event: "page_viewed",
    page_location: event.context.document.location.href,
    page_title: event.context.document.title,
    page_referrer: event.context.document.referrer
  });
});

analytics.subscribe("checkout_completed", (event) => {
  window.dataLayer.push({
    event: "checkout_completed",
    transaction_id: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    value: event.data?.checkout?.totalPrice?.amount
  });
});

GTMの側では、イベント名 page_viewed と checkout_completed のカスタムイベントのトリガーを作り、データレイヤー変数で transaction_id などを読み、GA4のイベントタグで page_view と purchase として送ります。

ページビューを page_viewed から送り直すのは、サンドボックスの中で動くため、GA4が自動で拾うURLにサンドボックスの情報が混ざることがあるからです。Shopifyのヘルプも、自動のページビューをオフにして page_viewed から送る方法を挙げています。

Shopifyの「設定」→「Customer events」→「Custom pixels」でコードを貼ったところ
Shopifyの「設定」→「Customer events」→「Custom pixels」でコードを貼ったところ

確かめ方

カスタムピクセルの中のGoogleタグやGTMは、Tag Assistantの「Troubleshoot tag」で見つけられません。Shopifyのヘルプは、Shopify Pixel Helperでイベントがエラーなく送られているかを確かめるよう書いています。そのうえで、GA4のリアルタイムで購入が1回だけ入っているかを見ます。

STUDIOに入れる

GA4は「Apps」でつなぐ

STUDIOは、プロジェクトのダッシュボードの左メニューにある「Apps」から外部サービスをつなぎます。使えるのはMiniプラン以上の有料プランを契約しているプロジェクトです。

  1. GA4で「管理」→「データの収集と修正」→「データ ストリーム」を開き、ウェブのストリームを選んで測定ID G-XXXXXXXXXX をコピーする。
  2. STUDIOでプロジェクトのダッシュボードを開き、左メニューの「Apps」を押す。
  3. 「Google Analytics」のカードの右端の「+」を押し、測定IDを貼って保存する。
  4. 公開済みのサイトなら、サイトを「更新」する。更新するまで反映されない。
  5. ライブプレビューのURLではなく、公開サイトを開いてGA4のリアルタイムで確かめる。

STUDIOのサイトは2026年6月11日を境に仕組みが変わっています。それより前に公開した旧基盤のサイトは、ページを移っても再読み込みしないつくり(SPA)で、GA4のデータストリームの拡張計測機能で、「ページビュー数」の「詳細設定を表示」にある「ブラウザの履歴イベントに基づくページの変更」のチェックを外さないとページビューが重なることがある、とSTUDIOのヘルプに書かれています。新基盤ではページを移るたびに読み込み直します。

GA4をAppsでつなぐのがおすすめなのも、この事情からです。旧基盤でGTMの中にGA4を置くと、Google広告から来た人が「自然検索」と記録されることがあり、STUDIOのヘルプは参照元を残せるAppsでの連携をすすめています。新基盤でもGTM経由では取りこぼしが残る場合がある、とも書かれています。

STUDIOのダッシュボードの「Apps」で「Google Analytics」のカードに測定IDを入れたところ
STUDIOのダッシュボードの「Apps」で「Google Analytics」のカードに測定IDを入れたところ

GTMは「Apps」かカスタムコードのどちらか

ボタンのクリックを数えるときはGTMを入れます。「Apps」の「Google Tag Manager」にコンテナID GTM-XXXXXXX を入れて保存し、サイトを「更新」します。IDの前後に空白が入るとつながりません。

ここで2つの重なりに気をつけます。

  • GTMのコードを「Apps」と「カスタムコード」の両方に入れると正しく動かない。1か所にする
  • GA4を「Apps」でつないだうえでGTMの中にもGA4のGoogleタグを置くと二重になる。GA4はAppsに任せ、GTMにはクリックのイベントタグだけを置く

GTMでボタンを数えるときは、STUDIOのデザインエディタで計測したい要素を選び、右のパネルの「設定」タブの「ID」の欄に cv-0001 のような文字を入れ、GTMのクリックのトリガーでその要素を指定します。STUDIOのヘルプでは、トリガーのCSSセレクタを #cv-0001, #cv-0001 * にして、要素の中の文字や画像を押したときも拾う形を案内しています。

カスタムコードは、Appsに無いタグを入れるための機能です。有料プランで使え、サイト全体か個別のページの <head> と <body> にコードを足せます。

STUDIOのデザインエディタで要素を選び、「設定」タブの「ID」に文字を入れたところ
STUDIOのデザインエディタで要素を選び、「設定」タブの「ID」に文字を入れたところ

申込の完了を数える

フォームの送信後にサンクスページへ移る形なら、GA4の「管理」→「データの表示」→「イベント」で、page_location がサンクスページのURLの page_view から新しいイベントを作り、キーイベント(旧コンバージョン)にできます。送信後がモーダルだとこの方法では数えられません。詳しくは「GTMでフォーム送信を計測する:サンクスページ型と送信イベント型」に書いています。

サービス独自のアクセス解析とGA4を両方見る意味

ShopifyとSTUDIOは管理画面にアクセス解析を持っています。WordPressの管理画面でSite Kitが見せる数字は、GA4とSearch Consoleのデータそのものです。

サービスの解析とGA4は数え方が違うので、数字は合いません。STUDIOのヘルプは、STUDIOのアナリティクスがAIのクローラーのアクセスも訪問者として数える一方、GA4は既知のボットを外すことを、差が出る理由の1つに挙げています。

両方を見る意味は、役割が違うことにあります。

見たいことサービスの解析GA4
注文の件数と売上正(Shopifyの注文がそのまま台帳)目安(同意やブロックで漏れる)
どこから来たか(検索・広告・SNS・LINE)大まかに見られる正(UTMや広告の連携で分けられる)
広告の成果見られないGoogle広告に取り込める
設定の手間ほぼ不要タグとキーイベントの設定が要る
タグが壊れていないか壊れない(サービスが数えている)壊れることがある

実際に運用していると、最後の行が効いてきます。サービスの解析はサービス自身が数えているので、テーマを替えてもタグを消しても数字が出続けます。GA4だけが急に下がり、サービスの解析は下がっていないなら、落ちたのはアクセスではなくタグです。毎月両方の比を見ておき、比が大きく動いた月にタグを点検します。点検の順番は「計測が取れていないときの点検手順:タグ・トリガー・フィルタ・権限を順に見る」に書いています。注文の件数と売上はShopifyの注文を正にし、GA4の購入の件数を合わせに行かないことです。

STUDIOでは、GA4を「Apps」でつなぎ、Googleアカウントで認証すると、STUDIOの「アナリティクス」の画面がGA4のデータに切り替わります。GTMだけでGA4を入れている場合は切り替わりません。STUDIOの画面でGA4を見たいなら、Appsに同じ測定IDを入れ、GTMの中のGA4のGoogleタグは止めます。

STUDIOの「アナリティクス」の「概要」で訪問者数とPV数が出ているところ
STUDIOの「アナリティクス」の「概要」で訪問者数とPV数が出ているところ

応用

サービスを乗り換えるとき

WordPressからSTUDIOへ、のようにサービスを替えても、GA4のプロパティとGTMのコンテナはそのまま使えます。同じ測定IDとコンテナIDを新しいサイトに入れれば、データは同じプロパティに続けてたまります。ただ、GTMのクリックのトリガーはボタンのIDやクラス名を手がかりにしていることが多く、サービスが替わるとそれも変わるので、クリックやフォームのタグは作り直しになると思っておきます。

同意バナーを入れるとき

Cookieの同意バナーには、同意されるまでGA4やGTMを止めるものがあります。Site Kitのヘルプも、同意のプラグインが同意前のアナリティクスやタグ マネージャーを止めることがあると書いています。バナーを入れた日から数字が落ちたら、タグより先に同意の設定を見ます。詳しくは「同意モードとCookieの扱い:日本の小さな会社に何が必要か」に書いています。

予約システムや決済ページへ移るとき

通常レッスンの予約を受ける外部の予約システム reserve.example には、こちらのGTMのコンテナは入れられません。予約システムの管理画面にGA4の測定IDを入れる欄があればそこに入れ、無ければ予約ボタンのクリックを数えます。ドメインをまたいで同じ人として数える設定は「クロスドメイン計測:予約システムや決済ページへ移るサイト」に書いています。

できないことと、その代わり

できないこと代わりの手
WordPressのブロックテーマで header.php に貼る子テーマの functions.php からフックで足すか、プラグインで入れる
子テーマで、テーマの乗り換え後もコードを残すテーマが替わる予定があるならプラグインで入れる
Shopifyのチェックアウトに追加スクリプトでコードを貼る2025年8月28日から表示のみ。カスタムピクセルかアプリのピクセルを使う
Shopifyのカスタムピクセルでボタンのクリックやスクロールを自動で拾うサンドボックスではページの要素を読めない。テーマ側からカスタムイベントを公開してピクセルで受ける
Shopifyのカスタムピクセルの中をTag Assistantで調べるShopify Pixel Helperで確かめる
STUDIOの無料プランでGA4やGTMを入れる「Apps」もカスタムコードも有料プラン。計測が要るならプランを上げる
STUDIOのライブプレビューで計測を確かめるGA4もGTMもライブプレビューでは動かない。公開サイトで確かめる
外部の予約システムにこちらのGTMを入れる予約システム側の計測の設定を使うか、予約ボタンのクリックを数える

よく詰まるところ

症状原因直し方
ページビューが前の週の約2倍になった同じ測定IDがテーマとプラグイン、AppsとGTMなど2か所から読み込まれているページのソースで G- と GTM- を検索し、1か所だけ残す
サイトのリニューアルの日から計測が0GA4のコードが旧テーマの header.php かテーマの設定欄に入っていたプラグインか子テーマで入れ直す
テーマを更新したらタグが消えた親テーマの header.php を直接直していた子テーマの functions.php からフックで足す
functions.php を保存したら画面が真っ白になった書き方の誤りや、先頭の <?php の重複サーバーのファイルマネージャーやFTPで元に戻す。編集前に必ず控えを取る
GTM4WPを入れたのに body の直後にコードが出ないテーマが wp_body_open を呼んでいない互換モードで「Footer」を選ぶ。1つ目のコードが head にあればGA4は動く
Shopifyで購入が1件も入らないtheme.liquid にだけGA4を入れていて、チェックアウトに届いていないGoogle & YouTube アプリかカスタムピクセルで入れる
Shopifyで購入が2倍に入るGoogle & YouTube アプリとカスタムピクセルの両方から purchase を送っているどちらか一方に絞る
Shopifyのページのレポートに見慣れないURLが並ぶサンドボックスの情報がページのURLに混ざっている自動のページビューを止め、page_viewed から page_location を送る
STUDIOでリアルタイムに何も出ないライブプレビューで見ている、またはサイトを「更新」していない「更新」を押し、公開サイトで見る
STUDIOで広告から来た申込が自然検索になる旧基盤のサイトでGTM経由でGA4を入れているGA4を「Apps」でつなぎ、GTMの中のGA4のGoogleタグを止める
STUDIOのアナリティクスとGA4の訪問者数が合わないSTUDIOはAIのクローラーも数え、GA4は既知のボットを外す合わせに行かず、比が急に動いたときだけタグを点検する
設定を直したのに公開サイトが古いままWordPressのキャッシュのプラグインやサーバーのキャッシュキャッシュを消してから確かめる。最適化のプラグインがコードを書き換える場合は対象から外す
GTMのプレビューで、GoogleタグがGTMから1回だけ発火しているところ
GTMのプレビューで、GoogleタグがGTMから1回だけ発火しているところ

次にやること

  • GA4の導入手順:アカウント・プロパティ・データストリームを作って測定IDを入れる
  • GTMの導入と初期設定:コンテナを作ってサイトに入れ、GA4タグを1つ置く
  • 計測が取れていないときの点検手順:タグ・トリガー・フィルタ・権限を順に見る
  • GTMでフォーム送信を計測する:サンクスページ型と送信イベント型

コードが1か所に入りテーマを替えても残る形になったら、次は体験申込の完了を数える設定に進みます。

あわせて読む