How To Make Guestbook On Blogspot | Cara Membuat Buku Tamu Di Blog | Tips Blogger - Sering saya jumpai kalau lagi jalan-jalan (blogwalking) menemukan widget yang cukup menggelitik menambah penasaran. Ya, Itulah buku tamu melayang pada sisi kanan atas/bawah. Timbul pertanyaan, Bagaimana cara membuatnya?....Ah dasar newbie hari gini baru nanyain soal itu, padahal jauh-jauh hari sudah tidak asing lagi bagi para blogger yang lebih senior dari pada saya.
Dari pada terus curhat, lebih baik saya catat cara membuatnya. Btw perlu di ingat juga semakin menambah widget pada blog kita maka akan bertambah berat ketika meloadingnya, Ya selain keuntungannya menghemat tempat, namun ada juga efek negatifnya (itu sudah biasa):
Silahkan anda copy kode di bawah ini..
1. Masuk pada menu Tata Letak / Edit Layout
2. Klik Tambah Gadget / Add a Gadget
3. Pilih HTML/Javascript
4. Copy kode berikut dan paste pada HTML/Javascript tersebut
<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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl7aMnAIMqQxRd4eis3x6jexYSmPnbiLFmVNvpAhjjOt5DPBW9d0agiMelglcmct_aKPcNfbjY_luiIZusIqSh8S4c-LPDLD4eZftMOpHMVvOa7bvJyZSIc5XdfuSylk2NjsjNdmCWhw5B/') 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">
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="0" width="200" height="305" src="http://www3.cbox.ws/box/?boxid=3384312&boxtag=ysj5en&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain3-3384312" style="border:#B9C8A0 1px solid;" id="cboxmain3-3384312"></iframe></div>
<div><iframe frameborder="0" width="200" height="75" src="http://www3.cbox.ws/box/?boxid=3384312&boxtag=ysj5en&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform3-3384312" style="border:#B9C8A0 1px solid;border-top:0px" id="cboxform3-3384312"></iframe></div>
</div>
<!-- END CBOX -->
<br/>
Anda berminat buat Buku Tamu seperti ini?<br/>
Klik di
<a href="http://upil-gue.blogspot.com/2012/06/how-to-make-guestbook-on-blogspot-cara.html">
sini </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>
Catatan:
1. Jangan satukan dengan iklan yang melayang karena akan menjadi kacau.
2. Yang diberi tanda berupa huruf yang merah dapat diganti, contohnya buku tamu anda yang shoutbox atau cbox.
3. Klik Save.
Sederhana alias mudah... Memang tidah serumit ketika harus menambah kolom, mebagi kolom, membuat kolom ada di kiri dan di kanan bla bla bla... saya sendiri dibikin rpot kalo udah urusan meracik template.. konsul langsung ke blognya kang Rohman ja atau oom...Baik sekian dulu.. Btw info ini juga hasil dari kombinasi dari beberapa blog hasil pencarian Prof. Dr. Google, Phd dll hehe
Preview:
Judul : How To Make Guestbook On Blogspot | Cara Membuat Buku Tamu Di Blog | Tips Blogger
Deskripsi : How To Make Guestbook On Blogspot | Cara Membuat Buku Tamu Di Blog | Tips Blogger - Sering saya jumpai kalau lagi jalan-jalan (blogw...
