Bikin Widget Followers Sendiri [NEW]

Yang paling penting disini Site ID dari Google friend connct.caranya..Mendapatkan Site ID Google Friend Connect

Site ID ini disimpen di Tampilan Tombolonclick="sowPolowerWer('04285798493244632009')"

Coba deh..

 Show followers

Load friendconnect.js

if(!document.getElementById('fb-root')){document.write('<div id="fb-root"></div>')}

function loadFriendConnectJs(){
  if(!window.google || !google.friendconnect){
    var gogfc = document.createElement('script'); gogfc.async = 'true';
        gogfc.src = 'http://www.google.com/friendconnect/script/friendconnect.js';
    document.getElementById('fb-root').appendChild(gogfc);
  }
}

loadFriendConnectJs();
</script>

Tampilan tombol

  <center>
    <b class="uiButton" onclick="sowPolowerWer('04285798493244632009')">
      <img src="http://www.google.com/friendconnect/scs/images/googleicon.gif" style="margin-right:5px;margin-left:-3px;vertical-align:middle;"> 
      <span style="vertical-align:middle;">Show followers</span>
    </b>
  </center>
</div>

Tampilan Widget Followers

function sowPolowerWer(siteId){
    var skin = {};
    skin['FACE_SIZE'] = '32';
    skin['HEIGHT'] = "16";
    skin['TITLE'] = "";
    skin['BORDER_COLOR'] = "transparent";
    skin['ENDCAP_BG_COLOR'] = "transparent";
    skin['ENDCAP_TEXT_COLOR'] = "#EFDF8A";
    skin['ENDCAP_LINK_COLOR'] = "#E5E5FF";
    skin['ALTERNATE_BG_COLOR'] = "transparent";
    
    skin['CONTENT_BG_COLOR'] = "transparent";
    skin['CONTENT_LINK_COLOR'] = "#BBE4E8";
    skin['CONTENT_TEXT_COLOR'] = "#FEFAEF";
    skin['CONTENT_SECONDARY_LINK_COLOR'] = "#FFFFFF";
    skin['CONTENT_SECONDARY_TEXT_COLOR'] = "#FFF6C8";
    skin['CONTENT_HEADLINE_COLOR'] = "#F2E8E2";
    skin['FONT_FACE'] = "verdana";
    google.friendconnect.container.setParentUrl("/");
    google.friendconnect.container["renderMembersGadget"](
    {id: "polower-wer",
     height: 16,
     site: siteId,
      locale: 'en_US' },
     skin);
}
</script>

CSS Tampilan tombol

<style type="text/css"><!--
.uiButton{
  font-family:"lucida grande",tahoma,verdana,arial,sans-serif; 
  color:#000033; 
  text-decoration:none; 
  cursor:pointer; 
  background-color:#FFFFEE; 
  background-image:url(http://www.deltechcorp.com/deltech02/brazil10/picts/menu.gif); 
  padding:3px 10px; 
  display:inline-block; 
  border:1px solid #3B5999; 
  -moz-border-radius:3px; border-radius:3px; 
  margin:1px; 
  font-size:11px;
}
.uiButton:hover, .uiButton:focus, .uiButton:active{
  color:darkred; 
  text-decoration:none; 
  border:1px solid darkred;
}
.uiButton:focus, .uiButton:active{
  background-image:none;
}
--></style>