BLOGFORCLEのブログ

ShopifyでGTM(Google Tag Manager)を設定する方法を解説

Shopify

  • 2023年4月16日
  • 2023年4月16日

ShopifyでGoogleやYahoo、Metaの広告などを複数配信したいときに役に立つのが「Google Tag Manager(グーグルタグマネージャー)」です。

ですがShopify内でどのようにGTMを設定すれば良いか分からなくて困っている、という方も多いかと思います。

実際にGoogle Tag Managerを使用することで、ソースコードも綺麗に整理ができ、タグの有効・停止などの管理も効率化できます。

そこで今回は「ShopifyでGTM(Google Tag Manager)を設定する方法」について詳しく解説していきたいと思います。

ShopifyにGTMを設定する方法は以下の流れで説明します。

 

  1. GTM(Google Tag Manager)の開設方法
  2. ShopifyへのGTMコード設置場所
  3. GTMタグの確認・プレビュー

それでは早速みていきましょう。

1. GTM(Google Tag Manager)の開設方法

まずは「GTM(Google Tag Manager)の開設方法」について解説していきたいと思います。

Googleタグマネージャーの開設方法は、下記の手順で開設できます。

 

shopify GTM
まずはタグマネージャーにアクセスして「無料で利用する」のボタンをクリックします。
 
 
 
shopify GTM
 
「アカウントを作成」をクリックして、新しいアカウントの設定を入力していきます。
 
アカウント名:「社名やサイト名」など適切なアカウント名を入力します。
 
国:日本国内であれば「日本」を選択します。
 
コンテナ名:「通販サイトのURL」など適切なコンテナ名を入力します。
 
ターゲットプラットフォーム:今回はShopifyなので「ウェブ」を選択します。
 
全て入力が完了したら「作成」のボタンを押して次に進みます。
 
shopify GTM
 
続いての画面です。
 
Googleタグマネージャーの利用規約についてのページです。
 
内容を確認し問題がなければ一番下のチェックボックスにチェックを入れて右上の「はい」を押します。
 
これで「Google Tag Managerの開設」は完了です。
 

2. ShopifyへGTM(Google Tag Manager)を設定する方法

続いては開設したGTMのタグを発行して「Shopifyへコードを設置する方法」についてです。
 
ShopifyへGTMコードを設置する場所・方法は下記の手順で設定します。
 
 
shopify GTM
 
まずは、GTM開設時にポップアップで表示されるGoogleタグマネージャーのコードを確認します。
 
ポップアップされたGTMコードは2種類あり、上下で貼り付ける場所が異なりますので注意しましょう。
 
またポップアップ表示を消してしまった場合は、管理画面右上での青いGTMのIDリンクをクリックすると表示できます。
 
まずは上のコードを右横にあるコピーアイコンをクリックしてコピーしましょう。
 
 
shopify GTM
 
コピーが完了したら、Shopifyの管理画面に移ります。
 
管理画面左側のオンラインストアをクリックして「テーマ」にアクセスします。
 
テーマにアクセスしたら、表示されたテーマ下の右側部分に「•••」マークをクリックして「コードを編集」をクリックします。
 
shopify GTM
コードを編集をクリックすると、各コードが管理されている編集画面が表示されます。
 
管理画面左側の項目から「theme.liquid」を選択して、ソースコードを開きます。
 
ソースコードを開いたら、タグマネージャーの指定通り「<head>内のなるべく上部」に設置するようにしましょう。
 
shopify GTM
 
設置が完了したら、Googleタグマネージャーの管理画面に再び戻ります。
 
タグマネージャーのタグ内の下の部分のタグを、同じように右横のアイコンを押してコピーします。
 
shopify GTM
 
タグをコピーしたら、Shopifyの管理画面に戻ります。
 
先ほどのテーマ内「theme.liquid」に戻り、今度は「<body>の直後」に貼り付けを行います。
 
shopify コンバージョンタグ
 
続いては管理画面左下の歯車のマーク「設定」を押します。
 
設定を押し「チェックアウト」をクリックします。
 
shopify GTM
 
Googleタグマネージャーに戻り、上部分のタグをコピーします。
 
shopify コンバージョンタグ
 
チェックアウト内で下にスクロールし「注文状況ページ」に画面を合わせます。
 
追加状況ページの追加スクリプトにコピーしたタグを貼り付けて、保存します。
 
これでShopifyへのタグマネージャーの設置は完了です。
 

3. GTMタグの設定・プレビュー

GTMのタグ発行、Shopifyへの設置が完了したら、最後はGTMタグのプレビュー・確認をして、正常に発火しているかどうかをチェックします。

GTM管理画面内、右上の「プレビュー」を押します。

確認したいサイトのURLを入力して実行します。

実行したら、計測したいコンバージョンアクションを実行し、タグが発火していれば正常に計測できています。

以上でタグのプレビュー・確認は完了です。

ShopifyでGTM(Google Tag Manager)を設定する方法のまとめ

今回は「ShopifyでGTM(Google Tag Manager)を設定する方法」について解説しました。

タグマネージャーを使用することで、さまざまなタグを一元管理でき整理することができるため、複数の広告タグを設置する際にはとても便利なツールです。

これからタグマネージャーを使って管理をしようと考えている方は、ぜひこの機会に設定してみてはいかがでしょうか。

ShopifyのECサイト構築、WEB集客、広告運用代行はお任せください

当社株式会社FORCLEは、Shopifyを使用したECサイトの構築・リニューアルも専門で行なっております。

ECサイトは作って終わりではなく、その後のWEB集客がカギとなります。

「通販サイトをリニューアルしたいけれど、どのカートショップを選べば良いか分からない」

「Shopifyの構築から運営まで任せたい」

という企業の方も大歓迎です。

当社はデジタルマーケティング専門の会社ですので、売れるサイト構築から商品のPR、分析まで全てトータルでサポートが可能です。

ShopifyのECサイト構築、WEB集客に迷われている方は、まずは当社の初回無料運用相談をご利用下さい。

当社の( お問い合わせフォーム )よりご相談が可能です。

この記事を書いた人

FORCLE編集部

FORCLE編集部

FORCLE編集部です。WEB広告やHP・LP制作、GoogleAnalyitcs分析など、さまざまな役立つ最新のWEBマーケティング情報を随時発信しています。