22 June 2011

Membuat Recent Status Bar Float untuk Twitter

Membuat Recent Status Untuk twitter bagi Blog ente yang terus Update tentang twitter.
ada caranya memasang di Blogger hehe. jadi status twitter terakhir kamu akan muncul di bawah layar browser kesayangan anda (mungkin di IE ga bakalan ya :p )
oh iya Untuk ini yang harus diperhatikan adalah. pastikan Account kamu tidak di Protect (Public) sehhingga Public dapat melihat status status Anda.
oke mari mulai.

Initialize / pasang framework jQuery Terlebih dahulu. di Edit HTML
masukan kode
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
Persis Sebelum tag </head>  

Lalu masuk ke Blogger Pilih design. di page Element Add Gadget terserah dimana. dan pilih HTML / Javascript

Ketik kode berikut
<script>
$(document).ready(function() {
var myuser = 'thepedox';
$.getJSON("http://api.twitter.com/1/statuses/user_timeline/"+myuser+".json?callback=?", function(json) {
   $('.mystat').html(json[0].text);
$('.ballon').fadeIn(1000);
 });
});
</script>
<style>
.ballon{z-index:999999;position:fixed;bottom:0px;left:0px;height:15px;width:100%;background-color:#000;padding:8px;
opacity:0.8;color:#fff;display:none;
}
.ballon a{
text-decoration:none;
opacity:1;
}
.ballon a:hover{
text-decoration:none;
opacity:1;
}
</style>
<div class="ballon"><b>Recent status on Twitter : </b><span class='mystat'></span></div>
ganti username ane thepedox dengan username ente :D

No comments:

Post a Comment

please dont using for spam...