MargoUtomo.Net > Tips Website > Menampilkan Twitter pada Header Website

Menampilkan Twitter pada Header Website

1 August 2010 oleh Admin | 584 pembaca Beri komentar »

Setelah asyik berkicau dengan akun Twitter, mungkin kita perlu membuat supaya kicauan kita lebih banyak terlihat atau terbaca oleh orang lain dan efeknya tentu akan lebih banyak yang akan mengikuti kita.

Beberapa pemilik website menempatkan widget Twitter pada sidebar mereka, kali ini kita akan menempatkan twitter kita pada header, yang lebih mudah terlihat dan terbaca dibandingkan bila kita letakkan pada bagian sidebar, apalagi sidebar bagian bawah.

Berikut perintahnya :

<div id=”twitter_div”>
<h2 style=”display: none;” >Twitter Updates</h2>
<ul id=”twitter_update_list”></ul>
<a href=”http://twitter.com/margoutomo” id=”twitter-link” style=”display:block;text-align:right;”>follow me on Twitter</a>
</div>
<script type=”text/javascript” src=”http://twitter.com/javascripts/blogger.js”></script>
<script type=”text/javascript” src=”http://twitter.com/statuses/user_timeline/margoutomo.json?callback=twitterCallback2&count=1″></script>

Div merupakan wadah untuk menampilkan twitter kita, kita perlu membuatnya dalam CSS kita. Contoh:

#twitter_div{display:block; position:relative; top:200px; left:25px; width:940px; height:25px; z-index:1;}

maka wadah untuk twitter sudah tersedia dan index:1 akan menimpa layout yang sudah ada.
margoutomo harus diganti dengan akun twitter anda.
count=1, dapat diganti dengan jumlah tweet yang ingin ditampilkan

Tidak perlu menggunakan pluggin karena cukup mudah. Untuk memperingan beban loading website anda, silahkan letakkan mulai dari tag <script> s/d </script> di footer tepat diatas tag </body>