cara membuat buku tamu tersembunyi

Buku tamu memiliki peranan penting dalam perkembangan blog. Buku tamu memunginkan pengunjung berinteraksi dengan kamu secara real time. Pengunjung juga dapat berinteraksi dengan pengunjung lain sehingga betah berlama-lama di blog kamu. Buku tamu atau biasa disebut shoutbox ini adalah suatu tempat untuk berinteraksi antara pemilik situs, pengunjung dan pengunjung lainnya. Kebanyakan shoutbox yang bagus adalah berbayar. Banyak sih yang gratis tapi kurang optimal dan kurang memuaskan. Jika kamu menemukan yang gratis dan optimal ya syukur. Punya banyak duit dan ingin yang keren ya syukur. Saya sendiri menggunakan yang gratisan, dan itulah saya apa adanya. hiks..hiks..

Tapi, buku tamu terkadang menghabiskan tempat yang cukup luas. Solusinya adalah menggunakan "buku tamu sembunyi". Buku tamu / Shoutbox sembunyi adalah shoutbox yang dapat disembunyikan kepinggir layar dan tidak akan menggangu pemandangan halaman. Buku tamu yang bisa sembunyi ini bisa menghilangkan kecemasan kamu akan kurangnya lahan. Ingin punya buku tamu yang bisa sembunyi seperti punya saya?? Simak To-torial berikut.

To-Torial membuat buku tamu sembunyi

1. Login ke blogger, masuk ke dashboard, pilih "rancangan" / "layout" yang ada di blog kamu

2. pilih "edit tata letak" dan pilih "tambah gadget". Pilih "HTML/Javascript" dan pastekan kode berikut:







<style type="text/css">
#gb{
position:fixed;
top:30px;
z-index:+1000;
}
* html #gb{position:relative;}


.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJq0I6VTV-OYfUsPi0ptS68RYyFDbExbUIzeQskVFVDyXJPZpOCugqGQQ3NW0OYhbiHgZJLjepPwANt3_TxqjuYg6ecTNGJrGlj4XQhyphenhypheniarVEkNeonHrf7J05l1gfl45UFjPdM5RAG63C-/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #FF0000;
background:#8B0000;
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">


<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="muhammadsyaroni" src="http://www5.shoutmix.com/?muhammadsyaroni" width="180" height="415" frameborder="0" scrolling="auto">
<a href="http://www5.shoutmix.com/?muhammadsyaroni">View shoutbox</a>
</iframe>
<br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />
<!-- End ShoutMix -->
<br />
Mau punya buku tamu seperti ini?<br />
Klik di
<a href="http://pojok-download-dot-cum.blogspot.com/2009/06/halaman-yang-anda-minta-memiliki.html">
sini (Info Blog)
</a>


<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>


</div>


</div>


<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Nah, setelah di paste JANGAN dulu di save! Kita akan pergi mendaftar di situs shoutbox, karena kode di atas belum ada apa-apa, yang mucul nanti cuman tulisan saja. Kalau kamu sudah punya shoutbox sendiri, kamu tinggal paste kode shoutbox kamu di tempat yang bertuliskan "[timpa tulisan ini dengan kode shoutbox kamu]" dan langsung save, kamu bisa melewati langkah 3 dan 4. Tapi, kalau kamu belum punya, maka kamu harus melanjutkan tutorial ini.

3. Buka tab baru dan kunjungi http://www.shoutmix.com/ untuk mendapatkan shoutbox yang gratis dan persis seperti yang saya punya saat ini (3-july-2010). Daftar, kemudian buat shoutbox kamu.

4. Biarkan desainnya standar atau mau kamu beri warna lain. Terserah. Setelah itu klik get codes untuk mendapatkan kodenya. Kamu juga bisa mengatur tinggi serta lebar shoutbox di halaman tersebut. copy kode yang ada dan timpa tulisan "[timpa tulisan ini dengan kode shoutbox kamu]" dengan kode tersebut.

5.setelah ditimpa, kamu save dan lihat blog kamu. Kalau kamu merasa buku tamu kamu kurang tinggi, atau ketinggian kamu tinggal ubah angka "top:30px" menjadi yang kamu mau. Semakin kecil angkanya semakin tinggi bukunya, begitupun sebaliknya. Perkirakan angka yang tepat, save, lihat hasil. kalau kurang mantap ulangi langkah tadi.

Nanti, kalau ada yang berkunjung ke blog kamu, dia akan menulis komentar, pesan atau mungkin kritik super pedas kepada kamu. Tinggal kamu yang mengelola buku tamu tersebut, supaya pengunjung betah berlama-lama di blog kamu. Sekarang untuk permulaan, mulailah menulis komentar di buku tamu blog saya.

Related Post: