bit.lyでのクリック数を表示するJavaScript「Showing Off bit.ly Clicks of Your Posts With jQuery」

短縮URLを利用するとそのクリック数などを把握することが可能です。
この数値をリンクの隣に表示することで、訪問者がクリックをする動機づけにさせられるかもしれません。
今回はbit.lyとjQueryを利用してこれを実現する方法をShowing Off bit.ly Clicks of Your Posts With jQueryから紹介します。
bit.lyでのクリック数を表示するJavaScript「Showing Off bit.ly Clicks of Your Posts With jQuery」サンプル

使用方法
とりあえずbit.lyアカウントでも取得しましょう。
それからjQueryからjquery.jsもダウンロードしてきましょう。
準備は完了です。
Showing Off bit.ly Clicks of Your Posts With jQueryを見ると、下記から始まる長いコードがありますので、これをコピペしましょう。
// When DOM is fully loaded
なお、このコードの中でbit.lyのアカウント名とAPI Keyを記載する必要があります。
API Keyはアカウント部分に表示されています。
$(document).ready( getBitlyClicks);
function getBitlyClicks(){
// your bit.ly login and API key
var bitly_login = 'アカウント名', bitly_key = 'API Key';
// init urls array
var urls = [];
// init lookup table that will hold short links and clicks count
var lookup = [];
// Get all links with class "bitly-clicks"
var tags = $('a.bitly-clicks'); //ここのa.以降を変更すると適用class名を変更可能です。

// ~ 中略
lookupCall();
}

上記をjbitly.jsとして保存し、下記のように記述します。
※もちろん別ファイルにせず、インラインでも構いません。
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jbitly.js"></script>

あとは.bitly-clicksをaタグに付与すれば完成です。
<a class="bitly-clicks" href="http://www.skuare.net/" rel="http://www.skuare.net/">Retweet</a>
bit.lyでのクリック数を表示するJavaScript「Showing Off bit.ly Clicks of Your Posts With jQuery」サンプル

sponsors

「bit.lyでのクリック数を表示するJavaScript「Showing Off bit.ly Clicks of Your Posts With jQuery」」をシェアする

記事作成:
記事URL:

TOP > > > bit.lyでのクリック数を表示するJavaScript「Showing Off bit.ly Clicks of Your Posts With jQuery」