「Shopify タグ」というと、商品管理・仕入管理・顧客・ブログ記事などに利用する、カテゴライズ用のタグを想起される人が多いでしょう。
しかし、今回の記事では、Googleアナリティクスや広告計測タグの管理方法について解説していきます。
広告タグや、ヒートマップツールなどをテーマファイルに記載していくと、どのタグをどこに貼ったのかわからなくなると思います。また、自分自身がわかっていても、他の業者さんが絡んだりしてしまうとゴチャゴチャしてしまいます。
どのサイトもこの問題が起こったことで、台頭してきたのが「タグマネジメントツール」となります。サイトのコードへのベタ貼りをやめて、タグマネジメントツール内で計測タグを管理しようということです。「Google Tag Manager」が一番有名なツールになります。
今回のこの記事では、そういったツールなどのご紹介なども行いながら、Shopifyでのタグ管理において、どの方法がベストプラクティスなのか、に迫っていこうと思います。
それでは早速行ってみましょう。
Shopifyで計測タグを管理する方法はある?
Shopifyでタグ管理するニーズがでてくるのは、広告運用をし始めたタイミングだと思います。
FaceBook広告やGoogle広告などの、全世界的に主要な広告媒体においては、Shopifyアプリで計測タグ設置やツール連携などができてしまいます。


上記の媒体を出稿するにはShopifyアプリを利用すれば良いですが、それ以外の場合においては、どのようにすれば良いでしょうか?
答えは簡単で、GoogleTagManagerなどのタグマネジメントツールを利用するか、サードパーティ性のShopifyアプリを利用するといった方法になります。
ただ、一つ注意する必要があるのが、GTMを正式にShopifyに導入するには、ShopifyPlusのプランを利用しないと行けないという点です。(もちろん、GTMベタ貼りで導入することは可能です)
また、GTMを利用したShopify アプリもあるので、そちらも要チェックです。
GoogleタグマネージャーをShopifyに導入する際、弊社が提供するShopifyアプリPafit Tag Managementを使う方法もあります。
手動設定の方法では導入後のタグやトリガー、変数の設定は面倒です。
そこで、Shopifyアプリを使うことで、タグマネージャーの導入とタグやトリガー、変数の設定を一括で行うことができます。
例えば、GoogleアナリティクスやGoogle広告、Facebook広告、Yahoo!広告などのタグをそれぞれ設定すると時間が掛かります。また、設定を間違えないように各サービスのドキュメントを見ながら設定するのは面倒です。
弊社が提供しているShopifyアプリのPafit Tag ManagementならGTMの導入とタグやトリガー、変数の設定を一括で行えます。さらにコーディング不要でデータレイヤー(datalayer)の用意も行います。
詳細は以下のページからご確認ください。

GTMでShopifyで計測タグを管理する方法について解説!
今回はShopifyテーマ「Dawn」を利用している際のGoogleタグマネージャーの設定方法をご紹介します。その他のテーマをお使いの際も同様に設定できますので、ご安心ください。
ただし、注意点としては関係のないコードを編集しないようにお気をつけください。心配な方は2番目の方法であるShopifyアプリの利用をご検討ください。
それでは、Shopifyのテーマのコードを編集し、Googleタグマネージャーを設定する4つのステップをご紹介します。
- タグマネージャーのアカウントの作成(タグマネージャーのアカウントをお持ちの方は手順2へ)
- タグマネージャーのコンテナの選択
- タグマネージャーのコードをShopifyのテーマ内に貼り付け
- 必要に合わせてタグの設定と公開
上記の手順に沿っていきます。
手順1: タグマネージャーのアカウントの作成(タグマネージャーのアカウントをお持ちの方は2番へ)
Googleタグマネージャーのホームページへ移動し、ログインを完了します。次に「アカウントを作成」を選択します。

次にアカウント名やコンテナ名を入力します。また、ターゲットプラットフォームは「ウェブ」を選択します。最後に作成を選択します。
アカウント名はご自身の会社名や店舗名、コンテナ名はショップのURLを入力してください。その他の情報を入力することもできますが、上記の情報入力をおすすめします。

利用規約を確認の上、「はい」を選択します。
EU圏内向けにサービスや商品を提供している場合はデータ処理規約をご確認の上、チェックを入れるかをご検討ください。

アカウントを新規作成した方は、次は手順3を行います。
手順2: タグマネージャーのコンテナの選択
アカウントをすでにお持ちの方はGoogleタグマネージャーのすべてのアカウントの画面で既存のコンテナを使うか、新しいコンテナを作成するか選択します。

画面右上の「GTM-XXXXX」を選択します。

手順3: タグマネージャーのコードをShopifyのテーマ内に貼り付け
「テーマ」→「アクション」→「コードを編集する」を選択します。

合計3箇所に貼り付ける必要がありますので、1箇所ずつ説明します。
1箇所目:theme.liquidの<head>内上部に追加
ピンク枠で囲まれたアイコンをクリックし、タグマネージャーのコードをコピーします。

theme.liquidの <head> 内のなるべく上のほうに貼り付けます。
今回利用しているテーマ「Dawn」では、9行目の下に貼り付けました。

2箇所目:theme.liquidの<body>直下に追加
ピンク枠で囲まれたアイコンをクリックし、タグマネージャーのコードをコピーします。

theme.liquidの <body> タグの直下に貼り付けます。
3箇所目:チェックアウト設定の追加スクリプトに設定
最後にチェックアウトページの追加スクリプトにもタグマネージャーを導入します。(注文完了ページでコンバージョンなどの広告タグを利用するための作業になります。)
ピンク枠で囲まれたアイコンをクリックし、タグマネージャーのコードをコピーします。

「設定」→「チェックアウト」を選択します。

ページ下部の「追加スクリプト」の「注文状況ページ」に貼り付けます。

手順4: 必要に合わせてタグの設定と公開
以上で作業は完了となります。
Shopifyでの計測用のタグ管理方法についてまとめ
Shopifyでの計測用のタグ管理方法については、下記の方法をご紹介しました。
- Shopifyの公式アプリを利用する(※公式が出しているものがある場合)
- Shopify のテーマファイルにタグをコーディング
- Shopify のテーマファイルにGoogle Tag Manager を導入する
- Shopify アプリを利用してGoogle Tag Managerを導入する
その中でも、やはりGoogle Tag Managerを利用する方法をおすすめしています。
アプリなどを利用しても、結局はどこでなにを設置したのかわからなくなる、追加したいイベントなどがあった場合に対応できない、などが起こりうるのです。
弊社によく相談にこられるケースとして、「二重計測されてしまって…」という事例です。
二重でデータが記録されているけど、なんでかわからないということです。基本的に、タグが2重で埋め込まれているからこういった事例が起こります。
弊社のShopify アプリ「Pafit Tag Management for GTM」を利用すれば、アプリ内とGTMで一元でタグ管理ができるので、どこで計測しているかわからない…という心配はありません。
