Googleタグマネージャーを使用したフォームイベントの追跡

公開: 2021-07-19

ウェブサイトでのコンバージョンを監視するためにイベントトラッキングを設定する簡単な方法を探している場合は、Googleタグマネージャーの使用を検討することをお勧めします。

この投稿では、Google Tag Managerについて説明し、インストール方法と、サイトでフォームイベントトラッキングを設定する方法について説明します。

GoogleタグマネージャーGTMV2

Googleタグマネージャーとは何ですか?

Google Tag Manager(GTM)は、ウェブマスターやマーケティング担当者がウェブサイトのタグを簡単に追加および更新できるようにする無料のツールです。 GTMを使用する方法はたくさんありますが、ほとんどの企業は、デジタルマーケティング戦略の成功を測定する手段としてイベント追跡にGTMを使用しています。 GTMの詳細については、紹介ブログの投稿をご覧ください。

イベント追跡にGTMを使用する理由

GTMを使用すると、イベントタグを完全に制御できます。 開発者にハードコーディングを依頼することなく、それらをサイトに追加できます。 これにより、他の重要なプロジェクトに取り組む時間を解放できます。

GTMを使用すると、イベントトラッキングを自分で修正およびテストできるため、プロセスがはるかに簡単になります。

さらに、JavaScriptを使用してフォームを作成するWebサイトが増えています。 これらのサイトはリンク先URLを使用しません。つまり、Analyticsで単純な目標を使用することはできません。 Webサイトの管理を将来にわたって保証するために、GTMを理解することを検討することをお勧めします。

GTMのインストール

GTMのインストールは、GoogleAnalyticsのセットアップと非常によく似ています。

  1. Googleアカウントを使用してGoogleTag Managerにログインします。理想的には、Analyticsで使用するものと同じです。 次に、画面の手順に従います。
    Google TagManagerがアカウントを作成します
    Googleタグマネージャーでアカウントを作成する

  2. 利用規約を読んで同意します。 その後、インストールコードが提供されます。 このコードは、サイトのすべてのページの開始<body>タグの直後に追加する必要があります。 これを自分で行うことができない場合は、開発者が次のことを支援できるはずです。

    Googleタグマネージャーコード
    あなたのウェブサイトのすべてのページにGTMコードを貼り付けます

それでおしまい。 サイトにタグマネージャーコンテナを設定しました。 このコンテナは、最終的にGTMダッシュボードで作成したすべてのタグを保持します。

次に、GTMを使用してイベント追跡を設定する方法について説明します。 このためには、ページ、クリック、およびフォーム内でいくつかの組み込み変数を有効にする必要があります。 GTMを設定すると、これらはデフォルトで有効になりません。 したがって、始める前に、変数に移動して、次のオプションを確認してください。

組み込み変数タグマネージャー

フォームイベントの追跡

フォーム送信追跡を使用すると、訪問者がWebサイトでフォームを送信するタイミングを監視できます。 これは、お問い合わせページの連絡フォーム、またはページのフッターにあるお問い合わせフォームの場合があります。 ほとんどすべてのWebサイトにフォームがあるため、これはTagManagerを理解するための良い方法です。

GTMインターフェースにすでに組み込まれているタグを使用できるため、GTMを使用してイベント追跡を設定するのは比較的簡単です。 HTMLコードの基本的な知識は役に立ちますが、このガイドでは、知っておく必要のあるすべてのことを説明します。

心配しないでください。タグマネージャーを使用してWebサイトを壊すことは不可能であり、タグを公開する前にすべてをテストできます。

これをやろう!

ステップ1—URLを特定する

フォームのURLをメモします。

ハラムインターネットグーグルタグマネージャー

フッターの照会フォームなど、複数のページにフォームがある場合は、ドメインを知っている必要があります。 この例では、 hallam.co.ukを使用しています。

ステップ2—フォームIDを特定する

送信ボタンのフォームIDを見つけます。 Google ChromeまたはFirefoxを使用している場合は、フォームを右クリックして[要素の検査]を選択することでこれを行うことができます。 <form>で「id」属性を探す必要があります。 これがどのように見えるかの例を次に示します。

フォームID検査要素

ヒント:インスペクター内でctrl + fを押すと、物事を検索できます。

:フォームに一意のIDがない場合は、開発者にIDの追加を依頼する必要がある場合があります。 ただし、WebサイトでWordPressの連絡フォーム7などのフォームプラグインを使用している場合は、自分でIDを追加できます。

ステップ3—トリガーを作成する

GTMで、新しいトリガーを作成し、後で簡単に識別できるようにタイトルを付けます。 「お問い合わせフォーム送信」や「お問い合わせページフォーム送信」のようなもので十分です。

[イベントの選択]で、フォームの送信を選択します。

お問い合わせフォーム送信トリガー

[続行]をクリックし、[タグを待つ]と[検証を確認する]をオンにして、(有効な)フォームの送信が成功したときにトリガーが起動することを確認します。

フォーム送信イベント追跡の検証

[続行]をクリックして、前にメモしたURLパスを入力します。

トリガーページのURLを有効にするページパスが含まれている

フォームが複数のページにある場合は、ドメインを含むページで起動するようにトリガーを設定できます。

トリガーグーグルタグマネージャーを有効にする

[続行]をクリックして、[一部のフォーム]を選択します。

トリガーgtmで起動

トリガーを確定するには、前にメモしたフォームIDを追加します(私のフォームIDは使用しないでください)。

フォームIDイベント追跡で起動

これで、トリガーを起動するために必要な条件を指定しました。 次に、タグを作成します。

ステップ4—タグを作成する

新しいUniversalAnalyticsタグを作成します。 このタグは、イベント情報をGoogleAnalyticsに送信します。 繰り返しになりますが、覚えやすい名前を付けてください。

タグイベント追跡グーグルタグマネージャーを作成する

次のフィールドにGoogleAnalyticsの追跡IDを追加します。

タグgtmを構成します

次に、トラックタイプをイベントとして入力し、カテゴリとラベルのトラッキングパラメータを決定します。

追跡パラメータグーグルタグマネージャー

この例のように、複数のページにあるフォームにこれを設定する場合は、ラベルの右側にあるボックスをクリックして、ドロップダウンメニューから{{ページパス}}を選択します。 これにより、Analyticsイベントレポートでフォーム送信イベントがトリガーされたページを確認できます。

イベントラベルページパス

[非相互作用ヒット]で、trueまたはfalseを選択できます。 非インタラクションヒットは、トリガーされたイベントがバウンス率などのメトリックに影響を与えるかどうかを決定できるパラメータです。 たとえば、ビデオが自動再生されるページがある場合は、「true」を選択する必要があります。 そうしないと、そのページにアクセスしたすべての人がイベントをトリガーし、バウンス率がゼロになります。

フォーム送信の追跡には、「false」を選択することをお勧めします。特に、追跡しているフォームが、訪問者が必要なすべての情報を確認して問い合わせフォームに入力するランディングページにある場合はそうです。 結局のところ、彼らはあなたのウェブサイトで別のページを表示していなくても、相互作用して目的のアクションを完了しているので、相互作用のヒットになるはずです。

非相互作用ヒットパラメータグーグルタグマネージャー

次に、[続行]をクリックし、[起動]の下の[その他]を選択します。 「フォーム」を選択し、前に作成したトリガーに移動します。

タググーグルタグマネージャーのトリガーを選択してください

[タグの作成]をクリックすると、完成したタグは次のようになります。

フォーム送信タグ完全なグーグルタグマネージャー

ステップ5—テスト

プレビューおよびデバッグモードに移動して、新しいイベント追跡が機能しているかどうかをテストします。

プレビューとデバッグモードのグーグルタグマネージャー

同じブラウザで、新しいタブを開き、Webサイトに移動します。ここで、TagManagerがデバッグモードを開きます。 ここからコンテナをプレビューでき、ページでどのタグが実行されたか、実行されなかったかがわかります。

GTMのデバッグとプレビュー

上記の例では、問い合わせフォームの送信を含め、これらのタグはいずれも私のページで発生していません。 これで、フォームをページで直接テストして、正しいタグが「このページで発生したタグ」に移動するかどうかを確認できます。

タグはデバッグモードのテストを起動しました

ステップ6—公開

タグが機能することをテストしたら、GTMダッシュボードに戻ってバージョンを公開します。 次のバージョンがうまく機能しない場合は、バージョンの名前を変更して、バージョンに戻すことができます。

公開バージョンのグーグルタグマネージャー

Ta-da —新しいイベント追跡タグとトリガーが公開されました。

フォームの最適化

コンバージョンを増やすために、サイトのフォームを改善することをお勧めします。 GTMを使用して各フォームフィールドを追跡し、テストおよび改善が必要なものを見つけることができます。 または、Hotjarなどのサービスを使用して、コンバージョン率を最適化するための便利なファネル分析を行うこともできます。

結論

イベントトラッキングの設定に関して、効率を改善し、テストの問題を解消したい場合は、Google TagManagerを使用することを強くお勧めします。

開発者がウェブサイトで進行中のより大きなプロジェクトに忙しく取り組んでいるとき、彼らは時間を解放するのでこの決定を高く評価していることがわかりました。 エントリレベルでは、タグマネージャ内の組み込みタグを使用でき、バージョン管理およびデバッグモード機能を使用してすべてを自分でテストできます。

このガイドを使用してフォームイベントトラッキングを実装するためにGoogleタグマネージャーを使用したことがある場合は、以下のコメントでそれについて聞いてみたいと思います。 または、Twitter @ Digital_Kymで私に連絡してください。


ご不明な点がございましたら、お気軽にお問い合わせください。