Udah lama nih ngak posting tentang tips blog. Kali ini saya akan memberikan tips cara membuat buku tamu atau lebih tepat nya menyembunyikan cbox. Baik lah tidak usah panjang lebar basa-basi nya. Ikuti langkah-langkah berikut :
1. Login ke blogger.com
2. Pada Dasbor >> Rancangan >> Elemen Laman
3. Klik Tambah Gadget, kemudian pilih bagian HTML/Javascript
4. Copy kode di bawah ini dan paste pada form HTML/Javascript tadi
<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px dotted #ff0000;
background:url(http://i51.tinypic.com/rcq4b7.gif) #000000 repeat-y center;
-webkit-border-bottom-right-radius: 25px;
-webkit-border-bottom-left-radius: 25px;
-moz-border-radius-bottomright: 25px;
-moz-border-radius-bottomleft: 25px;
border-bottom-right-radius: 25px;
border-bottom-left-radius: 25px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url() no-repeat;">
Kode Cbox Kamu
</div>
</div>
<br />
<div align="center"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="http://i1042.photobucket.com/albums/b429/Farix_2010/CloseComment-1.png" alt="close" title="Click here to Close Cbox" /></a></div>
<div align="right"><font size="2"><a href = "http://besttaufiqblog.blogspot.com/2011/11/cara-membuat-buku-tamu-keren-versi-2.html" target=_blank"><div style="color: #fff;">
<span style="font-size: x-small;">:: Get This Widget!! ::</span></div></a></font></div>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>
<br/>
<center><a href="javascript:void(0);"onclick="showHideAT()"/><img border="0" src="http://www.leaguelineup.com/tylerlions/images/guestbook1.gif" alt="cbox" title="Click here to open Guest Book" /></a></center>
- Ganti tulisan berwarna merah dengan kode cbox kamu
5. Simpan. Kemudian refresh blog kamu
Selamat Mencoba :D
nice info mas... wah... sgt mmbntu... thanks mas... btw hope you visit n follow back my blog... thanks... :)
BalasHapus@koerniawan
BalasHapussama2 gan :D terima kasih sudah mampir kesini :-p
siip gan....
BalasHapusane coba nih gannnn.. :-B
BalasHapussalam knal gan,, baru pertama nii code cbox na dapet dari mana??
BalasHapus#gaptek
trima kasih tips nya, sangat bermanfaat sekali bagi saya :)
BalasHapus@All
BalasHapusTerima kasih ya buat komentar nya :-p
Wuihhh..asyik juga tampilannya tuh bang..izin disedot ya sampe ubun-ubunnya...hahahyyyy
BalasHapuswah mantap brp ..... saya suka ..? makasih banyak
BalasHapusmantap kawand..
BalasHapusboleh nich tuk di coba..
terimakasiih bantuannya.
BalasHapusaku pake d blog ku tuh..
suka bgt..
kunjungi blog ku juga yaa..
msh nubie nii . .
mohon bimbingannya . .
:)
@All
BalasHapusThanks ya udah mampir dan berkomentar disini :-p
gan tolong share tutorial mbuatb cbox sperti punya agan yg skarang dong kalo sudah beri tahu saya di http:// tutor4-u.blogspot.com :((
BalasHapusthank toturial nya sangat bermanfaat.... kunjungi juga blog saya....
BalasHapusWah..thanks mas bro..keren bgt Guest Book'y :)
BalasHapus