Minggu, 02 Desember 2012

Widget Twitter JQuery


Widget kali ini adalah twitter widget dengan efek JQuery. Widget ini di buat oleh Mike More. Widget twitter ini cukup unik karena bisa menampilkan foto wajah-wajah followers dan friends (teman Anda) di twitter. Cara memasangnya:

1. widget Twitter Jquery Simple
Hanya menampilkan photo wajah-wajah friends dan followers Anda saja. Copy paste kode di bawah di atas kode </body> pada template Anda dan Simpan
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://twitter-friends-widget.googlecode.com/files/jquery.twitter-friends-1.0.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#friends').twitterFriends({ debug:1 ,username:'Rizky10_' }); }); </script>

  • Ganti username:'Rizky10_' dengan username twitter Anda
  • Copy kode di bawah dan pastekan di Tata Letak --- Tambah Gadget --- HTML/Javascript dan simpan.

<div id="friends"></div>
2. widget twitter jQuery dengan header dan footer.
Hampir sama dengan di atas namun yang ini memiliki header dengan tombol follow ke twitter Anda di sertai dengan footer juga. Copy paste kode di bawah di atas kode </body> pada template Anda dan Simpan
<link href="http://twitter-friends-widget.googlecode.com/svn/v2/light.css" rel="stylesheet" type="text/css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script src="http://twitter-friends-widget.googlecode.com/files/jquery.twitter-friends-2.0.min.js" type="text/javascript"></script>

  • Copy kode di bawah dan pastekan di Tata Letak --- Tambah Gadget --- HTML/Javascript

<div class="twitter-friends" data-options="{ username:'Rizky10_' }"> <a class="tfw-info" href="http://www.moretechtips.net" target="_blank">Twitter Friends/Followers Widget</a></div>

  • Ganti username:'Rizky10_' dengan user name twitter Anda dan simpan.


3. Twitter widget jquery dg header dan footer, di tambah update status followers atau friens (teman) Anda secara bergantian.
Hampir sama dengan yang ke 2 di sertai header, footer dan tombol follow. Namun bedanya widget yang satu ini berwarna gelap (hitam), dan di tambah efek jquery pada up date status teman Anda. Copy paste kode di bawah di atas kode </body> pada template Anda dan Simpan.
<link href="http://twitter-friends-widget.googlecode.com/svn/v2/dark.css" rel="stylesheet" type="text/css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script src="http://twitter-friends-widget.googlecode.com/files/jquery.twitter-friends-2.0.min.js" type="text/javascript"></script>

  • Copy kode di bawah dan pastekan di Tata Letak --- Tambah Gadget --- HTML/Javascript.

<div class="twitter-friends"> <!-- { username: 'Rizky10_' ,friends: 1 ,width:358 ,users_max:16 ,users_height:120 ,user_image:40 ,user_animate:'width' ,tweet:1 ,tweet_height:60 ,loop:1 } --> <a class="tfw-info" href="http://www.moretechtips.net" target="_blank">Twitter Friends/Followers Widget</a></div>

  • Ganti username:'Rizky10_' dengan user name twitter Anda dan simpan.


Gimana, sobat tertarik?, selamat mencoba... don't forget follow @Rizky10_ on twitter.

Tidak ada komentar:

Posting Komentar