iframe内のリンククリックをトラッキングすることができるjQueryプラグイン「iframeTracker」

iframe内のリンククリックをトラッキングすることができるjQueryプラグイン「iframeTracker」

iframe内のリンククリックをトラッキングすることができるjQueryプラグイン「iframeTracker」
  • シェアしてね♪
  • このエントリーをはてなブックマークに追加

  • 広告主様募集中
    ワンコインで広告掲載してみませんか?
  • このエントリーをはてなブックマークに追加

iframeTrackerは、iframe内のリンククリックを計測するためのjQueryプラグインです。iframeTrackerを導入することで、クロスサイトでのiframeのトラッキングが可能になります。

スポンサードリンク

iframeTrackerの使い方

iframeTrackerのダウンロードと設置

まずは、GitHubからiframeTrackerをダウンロードします。

ダウンロードしたファイルを解凍すると、jquery.iframetracker.jsというファイルが入っているので、jquery.iframetracker.jsをサーバー上にアップしましょう。

jQueryとiframeTrackerの読み込み

以下のコードを</body>の直前に記述して、jQueryとiframeTrackerを読み込みます。

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="jquery.iframetracker.js"></script>

jquery.iframetracker.jsのファイルパスは適宜変更してください。

iframeのトラッキング

jQueryとiframeTrackerを読み込むコードの後に、以下のコードを追加します。

<script>
jQuery(document).ready(function($){
$('.iframe_wrap iframe').iframeTracker({
blurCallback: function(){
ga('send', 'event', 'iframe', 'click');
}
});
});
</script>

iframe_wrapというクラス内のiframeがクリックされたら、Googleアナリティクスのイベントとして記録されます。上記の場合、カテゴリーが「iframe」、アクションが「click」になりますので、この部分は適宜変更してください。

クリックではなく単純に表示数をカウントしたい場合は、以下のように記述します。

<script>
jQuery(document).ready(function($){
var num = $('.iframe_wrap').length;
if( num == 1 ){
ga('send', 'event', 'iframe', 'view');
}
});
</script>

カテゴリーが「iframe」、アクションが「view」として、アナリティクスのイベントに記録されます。

あとがき

iframeのクリックや表示をカウントしたいという場面は意外とあるのではないでしょうか。広告のタグがiframeだった場合などに、表示数やクリック数をカウントして分析するのに活用できます。

この記事が気に入ったら
いいね!してね♪

Twitter で
スポンサードリンク

関連記事

コメントを残す

メールアドレスが公開されることはありません。