コンテンツに進む

Googleタグマネージャーで電話タップ時に電話番号を取得する方法

ウェブサイト内にお問い合わせ用の電話番号を掲載し、その電話番号のタップ回数(かけた回数)を計測しているケースは多いかと思います。

複数の電話番号を掲載している場合、どの電話番号がタップされたのかわかるようにしておくとよいでしょう。

今回はGoogleタグマネージャーを使用して電話番号タップ時に電話番号を計測する方法を解説します。

設定の手順

この手順で設定していきます。

  1. 変数
  2. トリガー
  3. タグ
  4. タグの作動をテストする

では、進めましょう。

1.変数の設定

Googleタグマネージャーのワークスペースの左側メニューにある「変数」をクリックします。

右上の「設定」をクリックします。

すでにいくつか変数が設定されているかもしれません。

右から画面が開いたら「クリック」の項目の変数をすべてチェックします。

変数はチェックを入れるだけで設定されますので、このまま右側の画面は閉じてかまいません。

これで変数の設定は完了です。

ちなみにここで設定した各変数は下記の要素になります。

  • Click Element
    • クリックされたすべての要素を計測
  • Click Classes
    • クリックされた要素のclass属性を計測
  • Click ID
    • クリックされた要素のid属性
  • Click Target
    • クリックされた要素のtarget属性を計測
  • Click URL
    • クリックされた要素のURLを計測
  • Click Text
    • クリックされた要素のテキストを計測

2.トリガーの設定

続いてトリガーを設定していきます。

左側のメニューから「トリガー」をクリックします。

トリガー一覧が表示されるので右上の「新規」をクリックします。

新しいトリガーにわかりやす名前を付けておきます。

中央の「トリガーの設定」をクリックします。

右からメニューが開くので「トリガータイプの選択」の中の「リンクのみ」をクリックします。

トリガーの設定画面が開くので、今回はこのように設定します。

  • このトリガーの発生場所
    • 一部のリンククリック
    • Click URL
    • 含む
    • tel:

これでこの条件でトリガーが発動する設定ができました。

続いてタグの設定です。

3.タグの設定

続いて左側メニューの「タグ」をクリックします。

すでにいくつかタグが設定されていると思います。右上の「新規」をクリックします。

新しいタグにわかりやすい名前を付けておきましょう。

中央の「タグの設定」をクリックします。

右側から「タグタイプの選択」画面が現れるので「Google アナリティクス」をクリックします。

「Google アナリティクス:GA4 イベント」を選択してください。

「測定ID」にGA4の測定IDを入力します。

測定IDをはGA4のウェブストリームにある測定IDです(G-で始まる)。

「イベント名」にわかりやすい名前を付けます。

ここは半角英数字記号(_)で命名してください。

イベントパラメータを2つ追加してこのように設定します。

  •  パラメータ1つめ
    • イベント パラメータ: lnk_url
    • 値 :{{Click URL}}
  •  パラメータ2つめ
    • イベント パラメータ: link_text
    • 値: {{Click Text}}

画面下の「トリガー」をクリックします。

先ほど設定したトリガーを選択して、右上の「保存」をクリックして完了です。

これでタグの設定が完了しました。

それではタグの作動をテストしてみましょう。

4.タグの作動をテストする

変数、トリガー、タグが設定できたらプレビューモードで動作をテストしてみましょう。

下のように設定した条件でタグがTags Firedになっているのを確認したら、この設定を公開します。

GA4のリアルタイムレポートでもタグの作動を確認しておきます。

これでサイト内に掲載している電話番号のリンクをタップ(電話をかける)した際にその電話番号を取得するする設定が完了しました。

もしここで設定したイベントをコンバージョンとして設定する場合は、反映に24時間程度かかりるため、また改めてGA4のイベント設定ページを確認してください。

レポートの作成方法

電話タップ時に計測されたデータ(電話番号、回数)をレポートにする方法はこちらの記事をご覧ください。

電話タップ時に取得した電話番号をデータ探索でレポートにする
https://reposub.jp/blogs/ga4/gtm_tel_tap_tel_number

以上、Googleタグマネージャーで電話タップ時に電話番号を取得する方法の解説でした

記事に戻る