「Google Tag Manager(GTM)で何ができる?」「ShopifyにGoogle Tag Manager(GTM)を設置する手順を知りたい」Shopifyでアクセス解析や広告のデータ測定を行う際、このような疑問を抱える方も多いことでしょう。Google Tag Manager(GTM)を使用することで、通常よりもスムーズに計測タグの管理が可能となります。
今回は、Shopify(ショッピファイ)でGoogle Tag Manager(GTM)を設置する方法について解説していきます。GTMに関する注意点やアプリについて紹介するので、現在使用を検討中の場合はぜひご参照ください。
Contents
Google Tag Manager(GTM)とは
Google Tag Manager(GTM)とは、Googleが提供するデータ測定用のマネジメントツールのことです。
一般的に、広告などのデータ測定を行うには、各種媒体から提供される計測用のタグを対象となるページのHTMLコードに埋め込みする必要があります。複数の測定タグがWebサイトページの至るところに点在している場合、後に場所の特定や管理が難しくなるでしょう。
しかし、GTMを利用すれば、Google 広告やGoogle アナリティクス、Yahoo! 広告、各種SNS広告まで幅広い媒体のコンバージョン測定タグを一括管理することができます。毎回のタグ修正や追加の際にHTMLコードを編集することなく、GTMの管理画面からまとめて対応できるため、より作業の効率化や簡略化を行うことができます。
Google Tag Manager(GTM)の注意点とポイント
続いては、Google Tag Manager(GTM)の注意点や使用上のポイントについて解説していきます。
- すべてのページにGTMを設置できるのはShopify Plusプランのみ
- Shopifyの広告運用ではさほど必要性がない
すべてのページにGTMを設置できるのはShopify Plusプランのみ
Shopifyには、ストア運営の規模に応じて「ベーシック」「スタンダード」「プレミアム」という3段階のプランが設けられています。そして、それら3つのベースプランの上位には、取引量の多い大企業向けの「Shopify Plus」という月額US$2,000(約20万円)のプランがあります。
Google Tag Manager(GTM)をチェックアウトページ含めたすべてのページで設置できるのは、前述した「Shopify Plus」プランのみ。現状ではShopifyのアップデートなども重なり、タグの計測結果が正しく反映されない状態となっています。
Shopify Plusプランは他プランに比べて大幅にコストがかかるため、よほどの大規模サイトでない限り導入のリスクが高くなります。
Shopifyの広告運用ではさほど必要性がない
Shopifyには、Google 広告やFacebook 広告のタグを設置する場所がデフォルトで設けられています。ECサイト運営において主力となる広告媒体というのは、上記したGoogle 広告およびFacebok 広告の2つです。
Shopify Plusの導入コストが負担になるような通常規模のECサイトであれば、Shopifyのデフォルト機能で設置できる広告のみで事足りるケースも珍しくありません。Google広告およびFacebook広告の計測を検討している場合は、GTMを活用する必要性がさほどないという点も念頭に置いておきましょう。
テーマコードを編集してGTMを設置する手順
では、Shopify(ショッピファイ)テーマコードを編集してGTMを設置する手順3ステップについて詳しくお伝えしていきましょう。
- 手順1:GTMアカウントの作成
- 手順2:GTMのコンテナの選択・新規作成
- 手順3:GTMタグをShopifyのtheme.liquidに貼り付け
手順1:GTMアカウントの作成
まずは、GTMの登録を行います。GTMの公式サイトの「無料で作成する」をクリックしてアカウント作成ページに移行しましょう。
そのまま「アカウントを作成」を選択して必要事項の入力画面に進みます。
次に、アカウントとコンテナの設定を行います。アカウント名には任意で管理しやすい名称を設定し、国の項目には運営サイトの対象国を選択します。
「コンテナ」とは、GTMタグを設置するWebサイトのことを指しており、ドメインごとに整理されています。コンテナ名は任意で問題ありませんが、基本的には運営サイトのドメインを入力しておきましょう。ターゲットプラットフォームの欄では「ウェブ」を選択します。
必要事項の入力を終えたら、画面下の「作成」をクリックします。GTM利用規約が表示されるため、同意欄にチェックを入れて「はい」をクリックします。
次に、「Google タグマネージャーをインストール」というページにGTMタグが2つ表示されれば、GTMアカウントの登録は無事完了です。
手順2:GTMのコンテナの選択・新規作成
続いては、作成したGTMアカウントの管理画面へ移り、コンテナの新規作成や選択について解説します。
GTMタグを設置するコンテナの選定では、すでに作成済みのコンテナを使用するか、新たにコンテナを新規作成する2つの手段があります。新規作成の場合は、画面右側にあるドットマークから「コンテナを作成」をクリックし、手続きを行いましょう。
今回は、先ほど登録した際のコンテナを使用するため、対象となるコンテナ名をクリックします。
下記画像のように「GTM-******」と記載された箇所をクリックします。
すると、GTMアカウント登録完了時に表示された「Google タグマネージャーをインストール」というページが再度確認できます。
手順3:GTMタグをShopifyのtheme.liquidに貼り付け
表示された2つのタグは、次の手順でそれぞれの指示するShopifyのHTMLコード内の箇所にタグを貼り付けていきます。
1ヶ所目:theme.liquidの内上部
まず、上部のGTMタグをコピーします。
Shopifyの管理画面の「オンラインストア」から「テーマ」をクリックします。続いては、現在ストアに反映しているテーマの「アクション」から「コードを編集」を選択します。
すると、テーマコードの編集画面に移行するため、theme.liquidの <head>内のできる限り上部に、さきほどコピーしたGTMコードを貼り付けます。
2ヶ所目:theme.liquidの<body>タグ直下
続いては、2本目のGTMコードをコピーし、指示通りに貼り付けていきましょう。
こちらは、<body>と記載されたコードの直下に貼り付けます。2本とも貼り付けが完了したら、そのまま「保存する」をクリックします。
3か所目:チェックアウトページの追加スクリプト
最後に、チェックアウト完了ページにもGTMコードを設置します。Shopify管理画面の「設定」から「チェックアウト」をクリックします。
画面下までスクロールし、「追加スクリプト」の項目に先ほど<head>と<body>に貼り付けたコード2つを同様に挿入しましょう。「保存する」をクリックすれば、すべてのGTMコードの設置が完了となります。
GTMでタグを設定・公開する方法
Shopifyストア内にGTMコードを張り付けた後は、GTM管理画面の方から必要に応じて各データ解析用タグの設定や公開作業を行う必要があります。
ここでは、それぞれの手順に従って詳しく解説していきましょう。
- 使用するタグの準備
- トリガーの設定
- タグの設定
- タグの公開
手順1:使用するタグの準備
タグとは、Shopifyストア上のデータ解析を行う際に、各媒体のシステムへデータを送信するソースコードのことです。データ解析したい広告などのタグを設定することで、Shopifyストア上のページ読み込みやクリック率といった詳細が把握できるようになります。
まず、Shopifyストアに設定したいデータ解析ツールの計測用タグを準備しましょう。Facebook PixelやGoogle アナリティクスコードなど、各解析ツールによって準備方法は異なるため、それぞれの手順に従って進めていきましょう。
手順2:トリガーの設定
次に、先ほど準備した計測用タグを実行するためのトリガーを設定する必要があります。トリガーとは、計測用タグが実行される際の条件のことです。前述したページ読み込みやボタンクリックなど、ユーザーが行う特定の動作をトリガーとして設定することができます。
ページ指定などのトリガーを設定したい場合は、GTM管理画面の「トリガー」から「新規」をクリックします。「トリガーの設定」にて必要情報を設定していきましょう。
手順3:タグの設定
GTM上でトリガー等の設定が完了したら、準備していた計測用タグを設定していきます。GTM管理画面の「タグ」から「新規」をクリックします。
「タグの設定」にある鉛筆マークを選択し、「カスタムHTML」を選択。HTML欄には、準備していた計測用タグを貼り付けます。
また、自身で設定したトリガーを使用する場合はこちらで呼び出す必要があります。使用しない場合は、「All Pages」のトリガーを選択。「保存」をクリックすれば、タグの設定が完了となります。
手順4:タグの公開
次に、設定したタグをユーザーの動作条件とともに実行できるように公開していきます。
タグの設定完了後、「公開」をクリックしてタグの名前を入力します。再度「公開」を押せば、タグの公開は完了です。
GTMタグが正しく設置されているか確認する方法
最後に、GTMタグは正常に起動しているか、GTMのプレビュー機能を活用して確認を行いましょう。GTM管理画面上の「プレビュー」をクリックします。
同じブラウザにGTM管理画面と並行して、タグの動作確認をしたいWebサイトページを表示しておきます。ページ下部のデバック画面から、公開タグの動作が正常か確認可能です。下記2点を参考に、タグの確認を行いましょう。
- Tags Fired On This Page:発火したタグ
- Tags Not Fired On This Page:発火していないタグ
Shopify(ショッピファイ)アプリならよりスムーズにGTMタグを設置できる
現在、GTM用のShopifyアプリケーションを利用して、より簡単に計測用タグの導入が可能です。
GTMを普通に利用した場合、各媒体の計測用タグを一つひとつ貼り付けたうえで、更にGTM管理画面からタグやトリガーなどの設定を行う必要があり、少し作業に手間がかかります。
しかし、Shopifyアプリケーションであれば、GTMコードの設置からタグ・トリガーの設定まで一括で行うことができます。各企業や運営からさまざまなGTM用アプリケーションが公開されているため、自身の運営状況に合った最適なものを選定してみてください。
まとめ
今回は、Shopify(ショッピファイ)でGoogle Tag Manager(GTM)を設置する手順について解説しました。
Google Tag Manager(GTM)を活用することで、これまで時間を要していたタグの修正や追加などの作業をスムーズに行えるようになり、作業の効率化が可能となります。現在では公式のGTMアプリケーションも公開されているため、利用すればさらに作業が簡略化できるでしょう。
ただ、GTMは大きなメリットをもたらす一方で、利用上のコストや機能の必要性についても考慮する必要があります。一般的な規模でのECサイト運営であれば、Shopifyのデフォルト機能でよりスムーズなデータ解析ができる可能性も高いので、GTMとの機能性を比較しつつ、最適な手法を採用しましょう。
Shopify Guideは、メディアの運営によってShopifyに関する幅広く情報を得ているため、Shopifyでの運営ノウハウを共有したりコンサルティングしたりすることができます。Shopifyの売り上げをアップさせるには、Shopifyの運営知識を持ったパートナーを見つけることが近道です。
Shopifyを使ったECサイトの制作をお考えだったり、Shopifyでの集客やマーケティングなどお困りだったりする方は、こちらの問い合わせフォームからお気軽にお問い合わせください。