Mamasang Follow Show - Hide

Trio Ardhian's
Pada suasana lebaran kali ini saya akan share tentang pemasangan widget follow show - hide, yang juga terpasang di blog saya. Selain itu dengan pemasangan follow show - hide sobat blogger bisa mamksimalkan / mengesifiensikan tata letak blog yang masing kosong (tidak makan temapat pada kolom gadget) dan juga bisa mempercantik tampilan sobat blogger. Untuk lebih jelasnya silahkan para sobat blogger menyimak dan ikuti tutorial yang akan saya jelaskan dibawah ini:

  1. Log in blog sobat blogger.
  2. Pilih Rancangan pada menu Dasbor.
  3. Pilih Elemen Halaman.
  4. Pilih Tambah Gadget.
  5. Selanjutnya pilih HTML/JavaScript, lalu COPAS kode script dibawah ini:
    6. <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/AVvXsEgoxzpvMBNmkF294UFaOmxvtmSrEzFhzmMpMFWEjTqfGPHG1aiihP6S9EmKtB7Smttyr9pVLbRBEifPCt78ZNj0YSvO-0D8UBjP6izCEIJ-TTD0gzuNdoIRCC7D437jRa8qZI8b1O91kmkg/)#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://www.berbagidisini.com/2010/10/memasang-widget-follow-showhide.html"target=_blank"><div style="color: #444444;">
    <span >By enda fiVers</span></div></a></font>
    </div>
    </div>
    <script type="text/javascript">
    var fl = document.getElementById("fl");
    fl.style.bottom = (-100-fl.offsetWidth).toString() + "px";    </script>
  6. Jangan di save dulu, untuk mendapatkan Kode Widget Follow click gambar di bawah ini: 
    7. Trio Ardhian's

  7. Setelah msuk dalam dalam website: http://www.google.com/friendconnect lalu akan muncul gambar seperti dibawah ini:




                                                                                                            Trio Ardhian's
                                                                                                            • Pilih blog sobat yang akan dipasang widget follownya 
                                                                                                            • Klik "Tambahkan gadget anggota" 
                                                                                                            • Silahkan diatur ukuran, warna dll nya.. 
                                                                                                            • Klik "Buat kode" 
                                                                                                            • Silahkan Copy kodenya, dan ikuti langkah selanjutnya. 

                                                                                                            • Paste kode Widget Follow tadi pada kode nomor 4 (Gantikan kode yang berwarna kuning dengan     kode Widget Follow yang sudah dicopy pada http://www.google.com/friendconnect) lalu pilih Save.
                                                                                                            • Lalu tambahan kode di bawah ini pada "Elemen Halaman HTML/JavaScript" yang telah dipilih lalu COPAS kode berikut :
                                                                                                              • <a href="javascript:showHideFL()"/><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhGh9gpMKUcFZouTHTHztH7SdRxrvQB05xA5eHJBAKDCz4YHnpUfgpA2ZbZhyphenhyphenqT8FMIN6eK5kEXT48Q0UfCKkbpnDx44LzyPhSDo8Q1iGBhaGwR0tMkZBOU9r69PnEKRy4zmm2ELv2n8gj/" alt="Fivers" 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>
                                                                                                            • Selanjutnya pilih Simpan & lihat hasilnya.

                                                                                                            Selesai sudah saya share tata cara meamasang follow show - hide, semoga bermanfaat bagi anda para sobat blogger.