Catetan

MENAMPILKAN REAL TIME TWITTER STATUS DI BLOGGER 1

Postingan kali ini berkaitan dengan twitter status, dimana hasil yang ingin ditampilkan adalah, update status twitter secara realtime, dengan isi dari status twitter yang berkaitan dengan kata-kata yang telah ditentukan.

misalnya udang dan ikan dimana hasilnya bisa dilihat dari Link DEMO disini.

Untuk cara penerapan di blogger sendiri sangat mudah pertama, masuk ke blogger - Edit HTML
kemudian cari kata
</body>

setelah ketemu, kemudian pastekan kode dibawah ini tepat diatasnya,

<script src='http://daffa.googlecode.com/files/jquery-1.4.2.min.js' type='text/javascript'/>
<script src='http://daffa.googlecode.com/files/jquery.relatedtweets-1.0.min.js' type='text/javascript'/>

proses selanjutnya adalah menambahkan kode Css, Cari kode
]]></b:skin>

lalu copy kode dibawah ini tepat diatasnya
div.rrt-inner{
height:58px;
padding:4px;
overflow:hidden;
}
div.rrt-inner ul{
float:left;
padding:0 0 0 0;
margin:0 0 0 0;
}
div.rrt-inner li{
float:left;
margin:0 0 0 0;
list-style-type:none;
position:relative;
}
div.rrt-inner span.rrt-author-img{
display:block;
width:48px;
height:58px;
margin:0 5px 0 0;
overflow:hidden;
left:0;
position:absolute;
}
div.rrt-inner strong a{
margin-right:5px;
}
div.rrt-inner span.rrt-body {
display:block;
margin-left:55px;
}
div.rrt-inner span.rrt-content{
}
div.rrt-inner span.rrt-meta {
color:#999999;
display:block;
font-size:0.764em;
margin:3px 0 0;
}
div.rrt-inner span.rrt-meta a{
color:#999999;
text-decoration:none;
}
div.rrt-inner span.rrt-meta a:hover{
text-decoration:underline;
}

Setelah itu disimpan...

selanjutnya masuk ke tab menu Page Element - Add Gadget - HTML/Script.
Pada jendela HTML/Script, masukkan kode dibawah ini
Cerita tentang : <a href="http://www.karsono.co.cc" rel="tag">udang</a> dan <a href="http://www.karsono.co.cc" rel="tag">ikan</a><p>
<div class="related-tweets">loading..</div></p>

Yang patut jadi perhatian adalah, sudah pasti link karsono.co.cc ganti sesuai link anda sendiri, sebenarnya link gak begitu pengaruh...
Yang kedua adalah kata rel="tag", nah kode inilah yang mengkondisikan pilihan dari kata-kata yang ingin ditampilkan misalnya kata ikan dan udang.

Maka yang harus dirubah adalah kata udang dan kata ikan

begitu... untuk DEMO-nya bisa dilihat dilink ini

1 comments:

Posting Komentar