2021.10.24

ShopifyにGoogleタグマネージャーを設置する方法をご紹介!

ShopifyにGoogleタグマネージャーを設置する方法をご紹介!

Googleタグマネージャーとは

Shopifyなどでショップやサイトを運営していれば必要になってくるのがアクセス解析やヒートマップなどの各種ツール類です。

これらはタグをサイト内に埋め込むことによって有効化され、訪問者がどれくらいいるか、ページのどのエリアをよく見ているか、どのページから流入してどのページで離脱しているかなど、分析を行うことができるのです。

しかし、使用するツールの数が増えるほど管理が難しくなりますし、サービスが終了したタグを一つひとつ削除したりデータの精度を上げるために上位版のタグを埋め込みなおしたり、サイト運営が長くなるほど煩雑な作業も増えるばかりです。

このようなとき非常に便利なのが、GTMと呼ばれるGoogleのタグマネージャーで、使用しているタグを一元管理することができるのです。

タグを更新したり削除したりという煩雑な作業が、GTM一つでかなり簡略化され愛用するユーザーはとても多くなっています。

テキスト

自動的に生成された説明

Googleタグマネージャーにも設置タグがあるので、それを自分のショップやサイトに貼り付けます。

続いて管理画面を通してGoogleアナリティクスなどの各種タグを登録すれば、自分でHTML作業をしなくても自動的にタグの有効化や更新などが可能になります。

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

GTMを利用する際、理解しておきたいのがタグやトリガーといった言葉の意味や役割です。タグはツールなどのコードになりますが、トリガーとはGTMを通して埋め込んだタグを発動させるための条件のことをいいます。

例えば、http:s//abc.com/dddというページだけにコンバージョン用のタグを設置したい場合、トリガーとして「http:s//abc.com/dddに限りコンバージョン用タグを表示」と設定することで指示を出すことができるのです。

GTMが設置されているページであれば、特に専門的な技術を持ち合わせていなくても、タグを挿入しどのページにどのようなタグを表示させるか簡単に設定することができるため、個人のショップであっても安心して分析などを行うことが可能になります。

GTMの設定方法

では、GTMの登録から説明していきます。まずはアカウントを発行しましょう。

テキスト

自動的に生成された説明

次のページで、アカウントを作成、をクリックします。

グラフィカル ユーザー インターフェイス, アプリケーション

自動的に生成された説明

新しいアカウントの追加、という画面になるので、必要事項を入力して、作成、をクリックします。

グラフィカル ユーザー インターフェイス, アプリケーション

自動的に生成された説明

利用規約が表示されたら、画面下のチェックボックスにチェックを入れ、画面右上の、はい、をクリックします。

なお、日本語表示はないため、翻訳ツールを利用するなどして詳細を確認するといいでしょう。

グラフィカル ユーザー インターフェイス, テキスト, アプリケーション, メール

自動的に生成された説明

GTMのタグが2種類表示されます。

上段のタグと下段のタグは貼り付ける場所が異なりますので、注意しながらサイトに設定しましょう。

タグを貼り付けたら最初の作業は完了です。

なお、画面上部と左サイドバーに表示されるメニューについては、次のような役割があることを覚えておきましょう。

  • ワークスペース:設定作業を行う画面
  • バージョン:これまでに作成し公開したタグやトリガーの履歴情報で、過去バージョンをさかのぼり以前の設定に戻すこともできる。
  • サマリー:サイトとタグ全体の状態
  • タグ:タグの編集及び管理を行うメニューで、新規追加タグや編集したいタグを扱う。
  • トリガー:タグを表示させるための条件指定部分。
  • 変数:タグを正しく表示させたり状況により変更が必要な部分を定義したりするための箇所。
グラフィカル ユーザー インターフェイス, アプリケーション

自動的に生成された説明

次に、新しいタグ、をクリックします。すると、新規タグの設定画面が表示されます。

グラフィカル ユーザー インターフェイス, アプリケーション

自動的に生成された説明

タグの設定、次にカスタムHTMLをクリックします。

もし他のタグもサイトに設置したい場合は、カスタムHTMLを使うことでサイトに組み込むことが可能です。

グラフィカル ユーザー インターフェイス, テキスト, アプリケーション, メール

自動的に生成された説明

カスタムHTMLを記入できる枠が表示されるので、任意のタグを記入もしくは貼り付けて保存します。

グラフィカル ユーザー インターフェイス, テキスト, アプリケーション, メール

自動的に生成された説明

タグの設定が完了したら、次にトリガーの設定に移ります。

テキスト

自動的に生成された説明

All Pagesを選択しますが、これは、サイト内のすべてのページにタグを表示させる指示になります。

選択したら、画面右上の、保存、をクリックしましょう。

グラフィカル ユーザー インターフェイス, テキスト, アプリケーション, メール, Teams

自動的に生成された説明

以上でGTMの設定は完了しました。

ただし、現状ではまだ設定のみ完了した状態で外部と通じていませんので、別途公開の作業が必要になります。

画面右上に表示されている、公開、をクリックしましょう。

続いて、サイト上に公開するタグの名称と詳細情報を記載して、再び公開をクリックします。

GTMは新しくタグを追加した場合、新しい方が適用になり更新される仕組みになっているため、更新手続きが完了するまではそれまで使っていたタグが有効のままになり、更新作業が完了したら新しいタグが自動的に有効になります。

以上で設定は完了します。

ここまでGTMの設定について説明してきましたが、メリットとしてまず挙げられるのは、やはりHTMLを直接さわることなくタグを追加したり編集や削除したりできる点にあるでしょう。

また、複数スタッフに管理権限があるのも利便性が高いといえます。

操作性はもちろん、現在設置中のタグを一目で把握できますし、タグ設置によるサイトのページ表示速度低下も防ぐことが可能です。

いくつもサイトを運営しており管理しなくてはならないページが膨大にある人などは、GTMによって管理環境が格段に良くなることが予想されます。

同様に、複数媒体で広告出稿している人にもおすすめできそうです。

Google タグマネージャーを設定する際の注意点

Googleタグマネージャーは非常に利便性が高く、さまざまなタグを集約して管理することが可能ですが、利用前に以下のことについて理解しておくことをおすすめします。

Googleタグマネージャーに関する学習と理解が必要

Googleタグマネージャーは、いったん設置すればその後の管理が非常に便利になるのですが、新しいツールを導入する際は常に学習と理解が求められます。

Googleタグマネージャーについても同じことがいえ、事前に関連書籍を読んだり導入後に実際に操作しながら感覚で覚えていったりする必要が出てくるでしょう。

Googleタグマネージャーの主な機能は、すでにサイトに設置されているタグを外し新しくタグを貼りかえるところにあります。

多くのサイト、多くのページを管理している場合は、タグが貼られているすべてのページをGoogleタグマネージャーに置き換える作業が必要になります。

とても手間のかかる作業ですが、一度やってしまえば後が楽になりますので、前向きにこなしていきましょう。

こういった実際の作業を行う上では、Googleタグマネージャーの全体像を知っておく必要がありますので、事前の学習と理解は必須になってくるといえます。

どのタイミングでタグを貼りかえるか判断が大事になる

サイト内に貼られているタグをGoogleタグマネージャーの管理下に置き、新しいタグに貼りかえていくには、最も適切なタイミングで作業を行わなければなりません。

既存サイトに設置されている従来タグを外さないうちに新しいタグを貼ってしまうと、データが二重になったり計測できなくなったりしてしまいます。

正しいデータを得るためにも、Googleタグマネージャーを使う前に、すでに設置されていたタグは忘れずに削除しておきましょう。

Googleタグマネージャーで扱えるタグを知る

Googleタグマネージャーはすべてのタグを扱えるわけではないので、2021年8月時点で有効なタグについてしっておきましょう。

タグウェブサイトAMPAndroidとiOS
AB Tasty
AdAdvisor
adjust*
Adobe Analytics
Adometry
AdRoll
AppsFlyer*
AT Internet
AWIN
Bizrate Insights
Burt
Chartbeat
ClickTale
Clicky
comScore
Crazy Egg
Conversant
Criteo
カスタム HTML
カスタム画像
Cxense
DistroScale
dstillery
Eulerian Technologies
Firebase Analytics
Floodlight
関数呼び出し
FoxMetrics
Google 広告
Google アナリティクス
Google 消費者アンケート
Google オプティマイズ
Hotjar
Infinity Tracking
Intent Media
K50
Kochava
Salesforce DMP(Krux)
LeadLab by wiredminds
LinkedIn
LinkPulse
Lytics
Marin
Médiamétrie
Microsoft Bing Ads
Mouseflow
mParticle
Nielsen
Neustar
Nudge
Oktopost
Optimise Media
ÖWA
OwnerListens
Parse.ly
Perfect Audience Pixel
Personali
Piano
Placed Inc.
Pulse Insights
Quantcast
Rawsoft
SaleCycle
SearchForce
Segment
Shareaholic
SimpleReach
Singular
Snowplow
Survicate
TradeDoubler
Tune*
Turn
Twitter
UpSellIt
Ve Interactive
VisualDNA
Webtrekk
Xtremepush
Yieldify

引用元:https://support.google.com/tagmanager/answer/6106924?hl=ja

まとめ:ShopifyにGoogleタグマネージャーを設置する方法をご紹介!

Googleタグマネージャーは使い慣れると非常に便利なツールだといえますが、導入当初はその使い方に戸惑うかもしれません。

日本語での情報がまだ限られているということもあり、細かな設定をしたかったりタグの相性を確かめたりするには、やや情報不足である点は否めないでしょう。

このため、他の方にGoogleタグマネージャーをおすすめする際、便利な点ばかりを強調してしまうと、相手が後から苦労してしまうことも考えられます。

事前の学習を前提として活用してみるよう提案してみることをおすすめします。

また、自社ショップでの使用においても、スタッフ同士でGoogleタグマネージャーに関する勉強会を開くなどして、常に情報の最新化を図ることも必要です。

そうすることで、Googleタグマネージャーが持つ強みを存分に活かしていくことができるでしょう。

Shopify experts(エキスパート)ならShopi Lab Shopify experts(エキスパート)ならShopi Lab
監修者
片岡弘一
片岡弘一

shopi labメディア運営統括・クリエイティブディレクター ウェブ・コロ株式会社 代表取締役

Web/SNSマーケティング、EC集客のスペシャリスト。前職ではWeb制作会社マーケティング部門の立ち上げを経て独立。現在は本業のWeb/SNSマーケティング運用に加え、新たに新会社を設立しWeb以外の分野にも挑戦中。

この監修者の記事一覧

あなたにおすすめの記事

よく読まれている記事

この記事を見た人はこんな記事も見ています

お問い合わせ

Shopi Lab(ショピラボ)

Shopi Lab(ショピラボ)をご覧のみなさまへ

Shopi Lab(ショピラボ)では、Shopifyのアプリや構築制作方法、運用マーケティング手段についてはもちろん、自社のECサイトを構築・運用する上で必要な情報を紹介しております。現在日本では開発業者の数が少ないため、検索しても役立つ情報が少ないことが現状です。そのためShopi Lab(ショピラボ)では、今後Shopifyの導入を検討している企業担当者様へ向けて、正確な役立つ情報を発信して行くことを心掛けております。 企業担当者様については、Shopify導入に対してご不明点や懸念事項がございましたら、お問い合わせ窓口よりお気軽にお問い合わせください。 また他カートをご利用中でShopifyへの乗り換えをご検討中の企業様についても、ご支援が可能でございます。世界シェアNo.1のECプラットフォームが日本で展開を初めて2年が経ちましたが、Shopi Lab(ショピラボ)ではさらにShopifyの魅力を発信していきます。