2015/6/15アナリティクス

【タグマネージャ】バナー画像の外部リンクをトラッキングする方法takahiro

  • このエントリーをはてなブックマークに追加
photo_link_eye

ちょっと前に新しいUIのGoogleタグマネージャで外部リンクをトラッキングする方法をご紹介しました。

ただ紹介した方法だと、画像をクリックした場合はGoogleアナリティクスのイベントを確認してもどの画像をクリックしたかまではトラッキングすることができません。

 

サイト内に外部リンクへのバナー画像などを貼っていて外部リンクを測定したい場合は不便ですね。

なので今回はどの画像をクリックしたかも確認できるよう変更していきます。

 

画像のaltをイベントトラッキングで取得してくるので、必ず設定しておきましょう!

 

前回のタグマネージャで外部リンクをトラッキングする方法で作成したGoogleタグマネージャのバージョンを変更していきますので、外部リンクのトラッキング設定がまだの方はそちらも参照してみてください。

 

変数の追加

前回の設定で、「url path」「element url」「element text」という3つの変数を追加で定義していました。

今回はそれに加えて2つの変数を定義します。

JavaScriptを使用しますが、コピペで問題ありませんので恐れる必要はありません。

1.linkurl

1

 

タイトルを「linkurl」とし、種類を【カスタム JavaScript】、変数設定に下記のコードをコピーして挿入してください。

 

 

上のコードはテキストリンクだった場合はそのリンクのアンカーテキストを、画像バナーでのリンクだった場合はその画像のaltの文章を取得するコードです。

もう一つ作成する変数はこのコード内で使用する変数を設定します。

 

2.linkElement

2

 

タイトルを「linkElement」とし、種類を【自動イベント変数】、変数設定を【要素】として変数を作成してください。

コードの中で使用している変数を定義しているのが分かりますよね。

 

タグの変更

後はタグの変更を行うだけです。前回トリガーの設定などはしているのでトリガーの設定については省略します。

前回設置した「GA 外部リンク計測」をクリックして編集画面にしてください。

 

3

 

前回設定した{{element text}}の部分を、今回定義した変数に置き換えます。

アンカーテキストや画像のaltが格納されている「linkurl」に変更しましょう。

 

4

 

変更はこの変数だけです。変更が終わったらタグを保存しましょう。

 

作成したバージョンの公開と動作確認

画像の外部リンクをトラッキングする為の設定は以上で終了です。

最後に忘れずバージョンを公開しましょう。バージョンを公開しないとサイトに適用されません。

 

公開が完了したら忘れずに動作確認を行いましょう。

Googleアナリティクスで対象のサイトのレポートを開き、リアルタイム>イベントを選びましょう。

対象のサイトより外部リンクをクリックしてイベントがちゃんと計測されているか確認しましょう。

 

「イベントラベル」が【クリックされた際のURL|外部リンク先のURL|クリックされた要素】となっていれば動作確認okです。

 

また、リアルタイム以外の場合は行動>イベント>上位のイベントより過去外部リンクのトラッキングを確認することが出来ます。もちろん設定を行ってからの期間のみです。

 

最後に

なんで前回の「Googleタグマネージャで外部リンクをトラッキングする方法」でまとめて書かなかったんだ!って感じですよね?

 

はい。すいません。。。

 

単純に僕に知識がなかっただけです。不便だったので調べました。

 

調べたらわさびさんの記事に記載されていましたので、備忘録も兼ねて書きました。

参考にさせていただきました。ありがとうございます。

 

JavaScriptを使用するとは言え設定は簡単ですので、外部リンクを測定する必要があるメディアサイトを運営されている方や、アフェリエイトをしている方は設定してみてはいかがでしょうか?

  • このエントリーをはてなブックマークに追加

この記事の著者

takahiro

takahiroWebデザイナー/ディレクター

Skill:HTML,CSS,PHP,WordPress,Photoshop

WEBサイト制作/運用/コンサルティング
たまにカメラとかもやってます。

この著者の最新の記事