Menampilakn Recent Twitter Tweets dengan jQuery

"Menampilkan Recent Twitter Tweets dengan jQuery."
Apakah anda ingin menunjukan tweet terakhir anda di web site atau blog,kalau begitu  Script jQuery ini akan sangat berguna bagi anda untuk menambahkan tweets baru baru ini kedalam situs web atau blog anda.
Kalian sudah taukan twitter,Twitter adalah layanan jaringan dan microblogging sosial dimiliki dan dioperasikan oleh twitter Inc, yang memungkinkan penggunanya untuk mengirim dan membaca pesan pengguna lain yang disebut tweets. Tweets adalah posting berbasis teks hingga 140 karakter ditampilkan pada halaman profil penulis.

 

Ok Langsung aja , Ikuti petunjuk dibawah ini :

1. Login Ke Dashbord Design > Edit HTML

2. Cari kode </head> Gunakan CTRL+F dibrowser anda untuk pencarian lebih cepat.

3. Copy kode dibawah ini dan letakan tepat di atas tag </head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript" charset="utf-8">

function showTweets(elem, username, number)
{
var html = '<ul>';


var tweetFeed = 'http://twitter.com/status/user_timeline/' + username + '.json?count=' + number + ' &amp;callback=?'
$.getJSON(tweetFeed, function(d)
{

$.each(d, function(i,item)
{
html+='<li>'+item.text+'</li>';
})
html+="</ul>";

elem.children().fadeOut('fast',function() {
elem.append(html);
})
})
}

$(function() {
$('#error').remove();
$('#preload').show();
showTweets($('#tweets'), 'risky_immerlieb', 5)
});

</script>

<style type="text/css">
#preload {display: none;}

#tweets ul li{
list-style-type:square;
list-style-position:inside;
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxFyJBavGIVqbNMmMa4fZ0xJFlvCz6UCM5ifj7VWjuFnZ-CRp-dkX3NV8H8q2BINqLgPz5QWFc_FASRdkOycKQ7OmtY_NL1kAxANYEm4X2L5yqcV9uvJqfIMgB0LgyWJT2RjIB8Dus_lw/s1600/twitter.png');
margin:0 0 0;
padding:0 0 0;
}
</style>

PS :Ganti Tuliasan yang bercetak tebal dengan ID twitter anda, dan angka 5. untuk   

      menentukan jumlah tweets yang akan di tampilkan nantinya.

4. Lalu anda simpan dulu (save template)

5. Buka Layout > Page Element.

6. Pilih Add a Gadget.

7. Pilih HTML Javascipt 

8. Copy kode dibawah ini lalu paste di kolom yang tersedia

<div style="font-size:12px;font-family:Arial;">
<div id="tweets">
<h3 id="error">There was a problem fetching tweets</h3>
<h3 id="preload">Currently loading your tweets...</h3>
</div>
<ul><li style="list-style-type:none;"><a href="http://www.twitter.com/risky_immerlieb">Follow me on twitter</a></li></ul>
</div>

 PS : Ganti Tuliasan yang bercetak tebal dengan ID twitter anda seperti petunjuk di 
        atas." 

 Ok Cuma itu saja Semoga Bermanfaat, Jangan Lupa Komentnya

Browse More Articles

Tweet

Written by risky

We are Creative Blogger Theme Wavers which provides user friendly, effective and easy to use themes. Each support has free and providing HD support screen casting.