外部のURLクリック時にどのURLがクリックされたかを計測する方法

ウェブサイトに外部のサイトのURLを掲載している場合に「どのURLがクリックされたか」をURLごとに判別したですよね。

今回はGoogleタグマネージャーを使用してサイトに掲載している外部サイトのどのURLがクリックされたかを計測する方法を解説します。

設定の手順

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

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

では、進めましょう。

1.変数の設定

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

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

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

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

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

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

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

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

2.トリガーの設定

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

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

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

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

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

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

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

  • タグの配信を待つ
    • 2000ミリ秒(デフォルトの設定です)
  • これらすべての条件が true の場合にこのトリガーを有効化
    • Page URL
    • 正規表現に一致
    • .* (ドットとアスタリスクです)
  • このトリガーの発生場所
    • 一部のリンククリック
    • Click URL
    • 含まない
    • 自サイトのドメイン

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

続いてタグの設定です。

3.タグの設定

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    これでサイト内に掲載している外部サイトのリンクがクリックされ際にどのURLがクリックされたかを計測する設定が完了しました。

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

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

    ブログに戻る