1.

Twitter Friends Widget v2.0 - jQuery Plugin

Posted by : Yatogami Sura Sunday, December 16, 2012


Twitter Friends/Followers Widget - v2.0 - A jQuery Plugin
A new version of my most popular jQuery plugin -Twitter Friends widget. This version aims to be better looking and easier to setup.

Setup Wizard
See how your twitter account will look like

Demo 1: Profile & Followers List

In this demo: used the light color scheme and set your Twitter username to show your Twitter profile and followers pictures as in Facebook fan box. 
* Plugin was tested to work with jQuery v1.2.6 to v1.7.1, refer for Google CDN for more info on hosted jQuery versions.

<!-- Include javascript and CSS once -->
<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>

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

Demo 2: Profile & Friends & Friends Tweets

This demo uses the black color scheme, displays your profile & friends pictures and rotates their latest tweets.

<!-- Include javascript and CSS once -->
<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>

<!-- Required HTML -->
<div class="twitter-friends">
   <!-- { 
      username: 'Mike_More'
      ,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>
<!-- Required HTML -->
   <!-- { 



New Features
  • Widget comes with 2 color schemes -light and dark- that you can extend to create your own scheme if you are familiar with CSS.
  • Default settings were adjusted to produce a simpler and better looking widget without much work on your side.

4 comments

  1. AndreDecember 16, 2012 at 11:24 PM

    Nice Info, saya sudah pake ini.. :D
    Blog Walking.. Visit Back bro..
    Jangan Lupa Follow + Tinggalkan Comment :D
    Semoga Harimu Menyenangkan :)

    ReplyDelete
  2. AndreDecember 16, 2012 at 11:25 PM

    Ups, kelupaan linknya
    http://www.MASTER-ANDRE.com/

    ReplyDelete
  3. SuraJiyeonDecember 16, 2012 at 11:48 PM

    kwkwkw ok bro! ane follow

    ReplyDelete
  4. rizki mutaqinJanuary 1, 2013 at 11:20 PM

    Nice Info .. Tapi Kalo Boleh Kasih Saran Lebih Kasih Tutor Yang Lebih Detail ,, Karna Para Blogger Baru Tentunya Susah Mengerti .. ~

    ReplyDelete

Followers