Widget Followers Unik Dan Keren

Kali ini aku akan membahas tentang widget followers
Dimana rekan/teman anda dapat dengan mudah mengikuti blog anda dengan suatu tampilan yang berbeda pada umumnya, Untuk contohnya anda bisa lihat tampilan followers nya pada blog ini.
Jika anda berminat, teruskan untuk membaca  dan mengetahui tentang cara membuatnya, tenang caranya ada kok di bawah ini.
Langsung adza pada pokok pembahasan...

Berikut ini ada cara membuatnya :
seperti biasa anada harus?
  • Login dengan akun blogger sobat
  • Masuk rancangan/design
  • Pilih Tata Letak/Layout
  • Klik Add a gadget, dan pilih HTML/Javascript
  • Selanjutnya, Copy dan Paste kode berikut..

<style type="text/css">
#fl{
position:fixed;
left:150px;
z-index:+1000;
}
* html #fl{position:relative;}
.flcontent{
float:left;
border:2px solid #676767;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLc1t4yQ5i3T7DeNzDBAd7sCPgi_-G0RppcRfBSUuPmXvL39St4sRtth9N7YFKJc5i8ynTXBP9sR0XhfzPr5laUVX85EwiaXfcrNHfpDX1yPifZo7DuHspjDOqqr82Q20yV7aDjSQpdjHc/)#000000 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">


Kode Widget Follow Disini


<div style="text-align: right;">
<a href="javascript:showHideFL()">
[Tutup]
</a></div>
<font size="2"><a href="http://kode-blogger.blogspot.com/2011/04/membuat-show-hide-widget-followers.html"target=_blank"><div style="color: #444444;">
<span >By kode-blogger</span></div></a></font>
</div>
</div>
<script type="text/javascript">
var fl = document.getElementById("fl");
fl.style.bottom = (-100-fl.offsetWidth).toString() + "px";
</script>

Setelah cara yang dia atas selesayyyy, Jangan disimpan dulu,karna  masih ada langkah-langkah  berikutnya yaitu :
  • Sekarang snda membuat kode widget followers-nya dengan google friend connect, untuk mengambil kode widget follownya silahkan masuk ke klik link_Disini 
  • Setelah anda masuk ke google friendconnect lihat pada gambar dibawah ini
  • Screenshot
  •  
  • Setelah masuk Pilihlah blog sobat yang akan dipasang widget follow-nya
  • Klik "Tambahkan Gadget Anggota"
  • Aturlah ukuran, warna dsb... menurut selera sobat/sesuaikan dengan blog sobat
  • Klik "Buat kode"
  • Copy dan Pastekan kode Widget Follow tadi (Gantikan kode yang berwarna merah dengan kode Widget Follow yang sudah dicopy tadi)
  • Lalu Save
  • Terakhir, Masih pada "Elemen Halaman" Tambahkan gadget HTML/Java Script, Kemudian copy paste-kan kode berikut ini:
    <a href="javascript:showHideFL()"/><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKUyEoFGFqQV1pBHxTTpRJFzT0WwlnGQcf76WIfkaZ-OPS8XjG5eju3THqJCzaleReyZ9Hii7q996s2u0fHZ6nmBMDA0Cn-wL2Ou_p5cPSlVkInIkO31JfmxPwYKbJgKhP9Ts1pp7WESrx/" alt="kode" title="Klik untuk membuka kotak Follow" style="display:scroll;position: fixed; top:150px;right:0px;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="130px" width="40px" /></a>
    Save dan lihatlah hasilnya.



    Sumber : kode-blogger

    || | Copyright 2012 By : Fikry Arpendos | Created By : DjaiL ||