plain and simply load . . .

The Current Time is:


Menampilkan Recent Twitter Tweets dengan JQuery

Apakah Anda ingin menunjukkan tweets terakhir Anda di dalam website atau blog. Ini akan berguna bagi anda untuk menambahkan tweets baru-baru ini ke dalam situs web Anda menggunakan tweets Jquery.

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.


Ikuti petunjuk dibawah ini:

1. Login ke dashboard Design -> Edit HTML
2. Cari tag </head>. Gunakan CTRL+F dibrowser anda untuk pencarian lebih cepat.
3. Copy kode dibawah ini dan anda taruh sebelum 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 + '&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'), 'FillahGrunge', 5)
});

</script>

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

#tweets ul li{
list-style-type:square;
list-style-position:inside;
list-style-image:url('http://4.bp.blogspot.com/_HJvXUqHmf9Y/TGISCT-W4yI/AAAAAAAAABI/VdnChTmVqUs/s1600/twitter.png');
margin:0 0 0;
padding:0 0 0;
}
</style>
CATATAN:
Tulisan FillahGrunge yang bercetak tebal silahkan anda ganti dengan ID twitter anda.

5 : Tentukan jumlah tweets yang akan ditampilkan nantinya.
4. Lalu silahkan anda simpan dulu (Save Template)
5. Buka Layout -> Page Elements
6. Pilih Add a Gadget.
7. Pilih HTML/Javascript untuk meng-copy kode dibawah ini.

<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/FillahGrunge">Follow me on twitter</a></li></ul>
</div>
CATATAN:
Tulisan FillahGrunge yang bercetak tebal silahkan anda ganti dengan ID twitter anda seperti petunjuk diatas.


Responses

0 Respones to "Menampilkan Recent Twitter Tweets dengan JQuery"

Post a Comment

 

Etika Copy Paste

Mengutip atau Menyalin tulisan disini dibolehkan asal menyebut nama penulis (Sumber atau Source) . Link Fatih Syuhud bisa dijadikan sebagai petunjuk buat kita.

Nge-Blog bertujuan untuk berkarya atau membiasakan menulis dan membaca bagi kita.

Recent Comment


by Fillah Grunge
©2010 - 2015 Fillah Grunge Home | About Us | Contact Us | Advertising | Supported
Back To Top