Simple jQuery Twitter Count Follower

Labels: •
Bismilllah. Alhamdulillah. Ketika kita mengunjungi suatu website kadang kita menemukan penghitungan (counter) jumlah follower Twitter. Hal ini cukup unik juga untuk kita pasangkan pada blog, selain untuk pelengkap blog, juga bisa kita gunakan sebagai pemberitahuan kepada pengunjung tentang jumlah pengikut blog kita di Twitter. Hal yang sederhana namun menarik perhatian. Bagaimana semua itu dibuat? Kali ini kita tetap menggunakan bantuan jQuery untuk menampilkan jumlah pengikut (follower) Twitter. Let's less write do more...

Integrasi Simple jQuery Twitter Count Follower pada Template

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke "Rancangan - Edit HTML"
Langkah 3
Cari kode dibawah ini:
</head>
Langkah 4
Masukan (copy paste) kode dibawah ini diatas kode pada langkah 3:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>//<![CDATA[
$(document).ready(function(){
$(function() {
$.ajax({
url: 'http://api.twitter.com/1/users/show.json',
data: { screen_name: 'NAMA ANDA' },
dataType: 'jsonp',
success: function(data) {
$('#followers').html(data.followers_count.
toString().replace(/\B(?=(?:\d{3})+(?!\d))/g, ","));
}
});
});
});
//]]></script>
Perhatian! Jika anda pernah memasang framework jQuery maka kode pada Langkah 4 baris 1 tidak perlu diikutsertakan
Langkah 5
Simpan Template kemudian masuk ke "Rancangan - Elemen Laman"

Integrasi Simple jQuery Twitter Count Follower pada Widget/Gadget

Langkah 6
Tambahkan Gadget baru dengan type "HTML/JavaScript"
Langkah 7
Masukan kode dibawah ini pada bagian konten:
<span id="followers"></span>
Langkah 8
Simpan gadget dan preview blog anda

Keterangan:
  • Ganti NAMA ANDA sesuai dengan akun twitter anda (lihat Langkah 4 Baris 6)...
  • Silahkan anda berkreasi menurut imaginasi anda...

Selamat mencoba dan berkarya... Happy Blogging :)