Simple jQuery Twitter Count Follower

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...

Simple jQuery Twitter Count Follower

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 :)

Read More

jQuery Anti Adblock Versi 2.00

Bismillah. Alhamdulillah. Artikel kali ini merupakan update atau perbaikan jQuery Anti Adblock Versi 1.00 yang terkesan rumit dan terlalu banyak script. Pada jQuery Anti Adblock Versi 2.00 ini dilakukan penyederhanaan sehingga proses integrasi pada Blogger lebih mudah dan lebih cepat reaksinya terhadap tingkah laku pengunjung. Mengenai apa jQuery Anti Adblock silahkan merujuk pada artikel sebelumnya.

Demo jQuery Anti Adblock

Update jQuery Anti Adblock Versi 2.00 (04 September 2011)

• Script ditelatakan pada Hosting Google Code sehingga lebih sederhana
• File CSS bisa diarahkan pada hosting sendiri

Integrasi jQuery Anti Adblock pada Blogger

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke "Rancangan - Edit HTML"
Langkah 3
Cari kode dibawah ini:

</head>

atau

</body>

Langkah 4
Masukan (copy paste) kode dibawah ini diatas kode pada langkah 4:
(Update 30 Desember 2012)

<script src='http://henscripts.googlecode.com/svn/trunk/jquery.antiadsblock.js' type='text/javascript'></script>

Langkah 5
Simpan template dan preview blog

Integrasi jQuery Anti Adblock pada Iklan

Jika kita sudah memasang jQuery Anti Adblock pada blog maka hal tersebut belum memberikan efek pada blog kita karena iklan kita belum memiliki identitas yang sesuai dengan jQuery Anti Adblock. Kita harus memberikan identitas pada kode-kode iklan yang kita pasang pada blog agar jQuery Anti Adblock mampu membacanya dan kemudian memberikan tindakan. Setiap kode iklan yang kita pasang pada blog haruslah ditempatkan diantara tag dibawah ini:

<div class="adsantilok">
<!-- Simpan Iklan Disini -->
</div>

Jika sudah demikian maka barulah jQuery Anti Adblock mampu bekerja dengan baik, silahkan dicoba untuk mem-preview blog anda dan aktifkan perangkat lunak pemblokir iklan dan lihatlah efek zoom dari jQuery Anti Adblock. SEMPURNA!!!!!!!!!!!!

Read More