Cara Membuat Buku Tamu Di samping kanan Blog

Written By Hanif Aghar on Minggu, 08 April 2012 | 8:40 AM

Kali ini saya akan share cara Membuat Buku tamu yang ada di samping kanan blog..Menggunakan chat Box yang bisa muncul dan menghilang (wah...ribet bilangnya...^_^ yang jelas kayak yg ada di blog saya ini..)
Banyak situs yang menyediakan layanan Chat Box  Misalnya Shoutmix, chatbox, cbox, oggix, shoutcamp dan masih banyak lagi yang lainnya..tinggal pilh sesuai selera..

langkah-langkahnya :
  1.  Login ke blog sobat
  2. Pilih Tata letak
  3. Tambah Widget (Pilih Widget HTML/JAVASCRIPT)
  4. Copy code di bawah ini ke dalam Widget :
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">


<!-- GANTI INI DENGAN KODE CHAT BOX SOBAT -->


<br/>
<br/>
<a href="http://forantum.blogspot.com">.
</a>
<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

<!-- GANTI INI DENGAN KODE CHAT BOX SOBAT -->
gantilah dengan kode script ShoutMix atau ChatBox milik Sobat.

Jika ada yang kurang jelas silahkan tinggalkan komentar.


Baca Juga yang ini Sob...:

14 komentar:

  1. makasih sekali informasinya sangat membantu untuk yang masih belum memasang, nice share

    BalasHapus
  2. siip" Makasih juga Dah Berkunjung.... :)

    BalasHapus
  3. maksudnya ganti dengan kode chat box itu gmn ya??

    BalasHapus
  4. kunjungan perdana mas trmksih mas dah berbagi kapan2 mampir mas di tempat ane biar tambah rame mas blog ane gak sepi kayak sawah hehehe

    BalasHapus
  5. bos . . ikutan yaaa, makasih sebelumnya.

    BalasHapus
  6. rada bingung mas, nyari url chat box yg mana sih????

    BalasHapus
  7. terimakasih gan atas tutorialnya !! salam kenal

    BalasHapus
  8. makasih, berkunjung balik yah, komen juga di buku tamunya :D

    BalasHapus
  9. visit me..
    http://bani-fahmi.blogspot.com

    BalasHapus

Silahkan Tulis Komentar, Kritik dan Saran Anda di Sini. Namun saya Mohon untuk tidak menggunakan komentar spam dan berkomentarlah yang sopan. Link aktif dari sumber lain yang ditulis pada kotak komentar akan saya Hapus. Terima kasih..

 
berita unik