Membuat Buku Tamu/Chat Box Show Hide
Ditemani secangkir kopi dan dan beberapa batang rokok saatnya posting,,,hehehehe,,baiklah gakusah pnjang lebar lg,,buku tamu/chat box mnurut saya bnyak gunanya dan sangat bermanfaat,gmn nrut sobat dexto???jika penting ,inilah cara membuatnya..
1. Masuk ke account Blogger kamu, pilih Layout: kemudian Page Elements.
2. Klik "Add a Gadget" yang mana saja, kemudian pilih "HTML/JavaScript",
3. masukan kode di bawah ini:
2. Klik "Add a Gadget" yang mana saja, kemudian pilih "HTML/JavaScript",
3. masukan kode di bawah ini:
<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 solid #33e104;
background:url(http://i846.photobucket.com/albums/ab26/arifins/fire.gif)#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;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
}
</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:#000;">
<!-- -->
</div>
</div>
<br />
<div align="right"><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>
<span ><a href="http://dextoshare.blogspot.com/2012/01/membuat-buku-tamuchat-box-show-hide.html"><div style="color: rgb(68, 68, 68);">
<span style="font-size:xx-small;">Get This Gadget</span></div></a></span>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>
<a href="javascript:showHideAT()"/><img border="0" src="http://i634.photobucket.com/albums/uu66/oktri_2009/o0c2d.png" alt="Fivers" title="Klik untuk membuka Buku Tamu" style="display:scroll;position: fixed; bottom:350px;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" ; /></a>
</div>
4.Simpan
masukan buku tamu sobat pada text yang berwarna merah
dan sobat bisa memodifikasi yang lain sesuai template/selerasobat dextoshare
Ni menarik.... lucu.
BalasHapus@Koerniawan_Blogiya??? makasih gan..
BalasHapusbagua banget nih informasinya.
BalasHapustapi saya masih bingung mau pake chatbox ato kaga. heheheeee...
@Fahmi Setiawanjahahha mna co2k gan,,,lo sran saya jngan,,,:D
BalasHapusAssalamualaikum...
BalasHapusMas maf ya OOT. Aq mw tanya, knapa ya blog aq kq ndak bisa dikasih breadcrumbs.....? N gimana sih caranya buat menu spoiler yang kyak di blog kmu ntu......? Tolong dijwab ya mas, aq sngat menghargai bantuan dari kmu.
Smoga God Bless You......!
Wassalamualaikum...
@The7Bloggerswlkum salam,,,y sob di tunggu j next post...
BalasHapus@MiftachudinMas bagi donk ilmunya supaya bisa membuat navbar hilang permanent. Tolong ya, cz aq mau mempercepat load blog aq mas?
BalasHapusKomentar ini telah dihapus oleh pengarang.
BalasHapus@The7BloggersTu dah saya post mga bisa mmbantu,,klo mu nghilangkan tinggal tmbah{display: none;} stau saya itu tdk trlalu brpngruh pada load blog..:D
BalasHapustrik yang bagus dan bermanfaat sob
BalasHapustapi saya bookmark dulu, karena kalau menurut hemat saya, lebih baik berkomentar langsung di postingnya si empu blog dari pada di buku tamu, kata para MASTER SEO bisa berguna untuk backlink blog kita,, hehehehehe
tapi kode yang sobat share, berguna juga untuk mempercantik box komentar,, muaaanteeeep daaaahh :D
y sykur klo bsa bermanfaat,,,
Hapusilmu yang keren gan ...
BalasHapusbtw blognya bagus gan ... ;)
mksihh mas,,blog mas lbih keren,,,:D
Hapusmampir sejenak kemari kawan. ^_^
BalasHapusKeren bro.. thanks..
BalasHapussalam blogger gan,..
BalasHapusmakasih ommm
BalasHapusvisit balik muizcyan.co.vu
saya izin share di blog saya yah :)
BalasHapus