簡単！Googleアナリティクスでクリックをカウントする方法
Googleアナリティクスのイベントを使用すると、簡単にリンクをクリックした回数をカウントすることができます。
例えば、このページにあるシェアボタンの「Twitterボタンが何回クリックされた」、「Facebookボタンが何回クリックされた」ということが集計することができます。
そのまえに、「わかった！Googleアナリティクスの登録から設定まで！ 」でGoogleアナリティクスの設置をしておいてください。
aタグのonclickにイベント送信を設置する
a要素には「onclick属性」というのがあり、ここにクリックしたときの動作を定義することができます。
このonclickにGoogleアナリティクスへイベントを送信するコードを書くことで、クリック回数を測定します。
クリックのイベントを送信するコードは以下になります。
<a class='tw social-popup' expr:href='"http://twitter.com/share?text=" + data:post.title + "｜" + data:blog.title + " &url=" + data:blog.url' rel='nofollow' target='_blank' title='Twitterにシェアする' onclick='javascript:ga("send", "event", "SNS Share", "Click", "Twitter", 1, {"nonInteraction": 1});'>Twitterにツイートする</a>
コードの解説
aタグ
クリックを定義するaリンクです。expr:hrefはBlogger特有の書き方で、Bloggerのテンプレート内で参照可能なデータから記事のタイトルとURLを参照してリンク先のhrefを生成しています。
expr:href='"http://twitter.com/share?text=" + data:post.title + "｜" + data:blog.title + " &url=" + data:blog.url'
このコードでは、TwitterへツイートするURLを生成してます。詳しくは、「BloggerにSNSシェアボタンを追加するよ！」の記事で書いているのでこちらを読んでくださいませ。
onclick属性
今回のメインは、onclickです。
onclickで呼んでいるga()がGoogleアナリティクスへイベントを送信するJavaScriptの関数です。
onclick='javascript:ga("send", "event", {カテゴリ}, {アクション}, {ラベル}, {値}, {"nonInteraction": 1});'
第1引数の"send"と第2引数の"event"は変更できません。{カテゴリ}、{アクション}、{ラベル}には、任意の文字列を記載することができ、送信するイベントを分類するのに使用されます。
{カテゴリ}にはイベントのカテゴリを書きます。例えば、記事へのリンクなら"article_link"、シェアボタンなら"SNS Share"などです。
{アクション}にはユーザーが行った操作を書きます。今回はクリックなので"click"にしています。
{ラベル}には、より詳細な分類を書きます。今回はSNSのシェアボタンの中のTwitterボタンなので"Twitter"としています。
{値}にはイベント計測時に加算する整数を入力します。今回はクリックを計測しています。1イベントに"1"ずつ加算したいので、"1"を入力します。ほかにも、広告を出している人であれば、1クリック3円の報酬であれば"3"を入力すると報酬を計測できますね。
より詳細な解説はGoogleヘルプを参照してください。Googleのヘルプはこちら から。
レポートを確認する
さっそく、リンクをクリックして計測されているか確認しましょう。
先ほど設置したリンクをクリックしてみてください。クリックしたら、Googleアナリティクスのサイトから、「リアルタイム」-「イベント」を選択します。
すると、下のほうにクリック回数がきちんと分類されて計測されていますね。
まとめ
Googleアナリティクスを使ったクリック計測はたった一行で、とっても簡単に設置できました。
いろんなテストして、アクセス解析のレポートみて、ニヤニヤしてしまいそうです。
最後まで読んでいただきありがとうございます。
また読んでくださいませ。
そんじゃーね。