Jumat, 18 Maret 2011

Memasang Widget Follow Tersembunyi

Halo sobat blogger semua yg sedang berburu trik nge-blog seperti saya juga. hehehe. Pasti anda bertanya-tanya bagaimana y cara membuat widget follow tersembunyi seperti yg ada di blog saya ini? Cobab saja klik gambar follow me yg berwana biru muda di sebelah kiri bawah blog ini. Caranya mudah hanya butuh koneksi dan ketelitian saja. Ok lah langsung saja kita ke TKP:


1. Pastikan login Blogger terlebih dahulu 
2. Masuk ke Perancangan Elemen Laman 
3. Tambahkan Gadget Html/Java Script 
4. Copas kode berikut :



<style type="text/css"> 
#fl{ 
position:fixed; 
right:190px; 
z-index:+1000; 

* html #fl{position:relative;}
.fltab{ 
height:32px; 
width:270px; 
float:top; 
cursor:pointer; 

.flcontent{ 
float:right; 
border:2px solid #676767; 
background:url()#F90 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">


HAPUS TEKS INI GANTI DENGAN Code script Follower Blog anda disini


<div style="text-align: right;">
<a href="javascript:showHideFL()"> 
[Tutup] 
</a></div> 
<font size="2"><a href="NAMA SITUS ANDAรข��target=_blank"><div style="color: #444444;"> 
<span style="font-size: xx-small;">By NAMA ANDA</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 di Copas tapi jangan di simpan dulu ikuti langkah selanjutnya
5. Ambil dulu code script Followernya DISINI tapi sebelum anda ambil codenya lakukan langkah-langkah berikut ini :
- Log in dulu ke Akun google dengan mengklik MEMULAI ( Get Startet)  kemudian masukan  E-mail  dan sandi anda kemudian
- Pilih blog sobat yang akan dipasang widget follownya “disamping kiri”
- Klik "Tambahkan gadget anggota" (Add the members gadget) atas
- Silahkan diatur ukuran, warna dll nya.. (Choose colors)
- Klik "Buat kode" (Generate code) paling bawah
- Silahkan Copy kodenya, dan ikuti kembali langkah selanjutnya
6. Paste kode Widget Follow yang anda copy tadi ke kode diatas dan ganti kode yang bernama (HAPUS TEKS INI GANTI DENGAN Code script Follower Blog anda disini) yang terdapat ditengah-tengah codescript diatas dengan kode Widget Follow yang sudah dicopy tadi)
7. Simpan (Save).
Terus langkah terakhir anda masuk ke Rancangan – Edit HTML cari  dan paste code brikut tepat diatas kode </body>
<a href='javascript:showHideFL()' style='display:scroll;position: fixed; bottom:65px;left:5px;' title='Follow'><img src='http://img842.imageshack.us/img842/6780/followimage.jpg'/></a>


8. Simpan template dan lihat hasilnya


Semoga info ini berguna untuk memaksimalkan tampilan blog sobat blogger


sumber




Tidak ada komentar:

Posting Komentar

LinkWithin

Related Posts Plugin for WordPress, Blogger...