Widget Google Followers Tersembunyi

Widget followers yang satu ini lebih ringan di bandingkan dengan Widget followers standard dari bloger, karena widget followers-nya kita sembunyikan maka loading blog terkesan lebih ringan. Berikut cara Memasang Widget followers yang lebih ringan dengan mode Show-Hide :

1. Login dengan akun blogger sobat, klik Rancangan / Design > Elemen laman / Page Element.
   
2. Klik Add a gadget / Tambah Gadget, dan pilih HTML/Javascript.
   
3. Letakkan kode berikut didalam area konten;
   <style type="text/css">

   #fl{position:fixed; left:150px; z-index:+1000;}

   * html #fl{position:relative;}

   .flcontent{

   float:left;

   border:2px solid #676767;

   background:#dddddd repeat-x bottom center scroll;

   -moz-border-radius-topleft:15px;

   -moz-border-radius-topright:15px;

   -moz-border-radius-bottomleft:15px;

   -moz-border-radius-bottomright:15px;

   padding:10px;

   }

   </style>

   <script type="text/javascript">

   function showHideFL(){

   var fl = document.getElementById("fl");

   var w = fl.offsetWidth;

   fl.opened ? moveFL(0, -100-w) : moveFL(20-w, 0);

   fl.opened = !fl.opened;

   }

   function moveFL(x0, xf){

   var fl = document.getElementById("fl");

   var dx = Math.abs(x0-xf) > 25 ? 35 : 1;

   var dir = xf>x0 ? 1 : -1;

   var x = x0 + dx * dir;

   fl.style.bottom = x.toString() + "px";

   if(x0!=xf){setTimeout("moveFL("+x+", "+xf+")", 10);}

   }

   </script>

   <div id="fl">

   <div class="fltab" onclick="showHideFL()"> </div>

   <div class="flcontent">

   
   

   Letakan Kode Widget Follow Disini

   
   

   <div style="text-align: right;">

   <a href="javascript:showHideFL()">

   [Close]

   </a></div>

   <font size="2"><a href="http://wadahtutorial.blogspot.com/"target=_blank"><div style="color: #eeeeee;">

   <span >Tutorial Blog</span></div></a></font>

   </div>

   <script type="text/javascript">

   var fl = document.getElementById("fl");

   fl.style.bottom = (-100-fl.offsetWidth).toString() + "px";

   </script></div>
4. Ganti Letakan Kode Widget Follow Disini [kode yang berwarna merah] dengan kode Widget Follow dari google friend connect, untuk mengambil kode widget follownya silahkan ikuti tutorial Widget Followers Google Friend Connect
5. Setelah dapat kode-nya, paste kode tersebut pada area konten Widget Follow tadi, Lalu Save
6. Terakhir, masih pada Elemen Halaman, klik Tambahkan gadget > HTML/Java Script sekali lagi, Kemudian copy paste-kan kode berikut ini:

   <a href="javascript:showHideFL()"/><img border="0" src="http://i1193.photobucket.com/albums/aa345/bakulatz/fl.png" alt="Follow" title="Klik untuk membuka kotak Follow" style="display:scroll;position: fixed; top:30px;right:50px;cursor:pointer;style=" opacity:1;filter:alpha(opacity="100)&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" ;" height="49px" width="130px" /></a>

7. Save dan lihatlah hasilnya.

Semoga Bermanfaat...

Sumber : Widget Google Followers Show Hide