cara membuat guest book/buku tamu tersembunyi
happy ramadhan..hehhehe..
sobat mungkin udah pada banyak yang tau cara membuat guest book/buku tamu tersembunyi , tapi menanggapi comen sahabat saya disini ,apa salahnya kita berbagi dan mengulang nya lagi..kan gak rugi kan? siapa tau ada yang belum tau..
nah langsung aja kita ke TKP gimana cara buatnya..
nah langsung aja kita ke TKP gimana cara buatnya..
- log in ke blogger
- pilih design/rancangan
- page elements
- pilih add gadget
- pilih tambah javascript/html
- masukan kode si bawah ini
<style type="text/css">
#gb{
position:fixed;
top:25px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:150px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYi-DZFo1M-TwfBRrWbxwuDBUnBRDr1KPkG53cVsVTne5pKVZrtMH7uBuAnva_W-2Fz3k5eBpvk3ijEoAVYhP-hNJIn2hWoANmfdJ9lrdm9ua7m3F3Gkz9l3AHu7tL1z6R-1BQtCOHRwNt/s128/guestbook.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #1300F2;
background:#A9A9F5;
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">
<div id="cboxdiv" style="width: 200px; height: 350px;"></div>
function togglecbox () {
var cbdiv = document.getElementById("cboxdiv");
if (!cbvis) {
if (!cbload) {
cbdiv.innerHTML = '<iframe frameborder="0" width="200" height="265" src="http://www4.cbox.ws/box/?boxid=4086446&boxtag=w5wcvm&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#636C75 1px solid;border-bottom:0px" id="cboxmain"></iframe><iframe frameborder="0" width="200" height="75" src="http://www4.cbox.ws/box/?boxid=4086446&boxtag=w5wcvm&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#636C75 1px solid;border-top:0px" id="cboxform"></iframe>';
cbload = true;
}
cbdiv.style.display = "block";
}
else {
cbdiv.style.display = "none";
}
cbvis = !cbvis;
}
</script>
<!-- move the next line to the bottom of your <body> to defer the loading of your Cbox -->
<script>togglecbox();</script>
<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>
yang berwarna merah ganti dengan kode cbox/shoutmix sahabat semua..setelah itu save ..
selesai deh, semoga bermanfaat...
update,sesuai permintaan pengunjung cara membuat buku tamu disebelah kiri..
<style type="text/css">
#gb{
position:fixed;
top:10px;
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/AVvXsEhgZ-KeKCdf9JjQ5JM1a4qwzN76Trmq_if2WUSs_a-hXU76FKalgIzI0K9hu09b_1wfjxPtTXSQjhr-SslFKDtO2nqsycd4KMKeCJtM39uhzop2rWBJ1F-9xJ44IxdgEx5_VX-7UHaDwPDx/') 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">
<--------------Masukkan kode script buku tamu sobat disini-------------->
<div style="text-align: right; font-size: 10px;">
Widget by
<a href="http://berryhardisakha.blogspot.com/2011/07/cara-membuat-guest-bookbuku-tamu.html">
Belajar dari internet
</a>
</div>
<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>
update,sesuai permintaan pengunjung cara membuat buku tamu disebelah kiri..
<style type="text/css">
#gb{
position:fixed;
top:10px;
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/AVvXsEhgZ-KeKCdf9JjQ5JM1a4qwzN76Trmq_if2WUSs_a-hXU76FKalgIzI0K9hu09b_1wfjxPtTXSQjhr-SslFKDtO2nqsycd4KMKeCJtM39uhzop2rWBJ1F-9xJ44IxdgEx5_VX-7UHaDwPDx/') 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">
<--------------Masukkan kode script buku tamu sobat disini-------------->
<div style="text-align: right; font-size: 10px;">
Widget by
<a href="http://berryhardisakha.blogspot.com/2011/07/cara-membuat-guest-bookbuku-tamu.html">
Belajar dari internet
</a>
</div>
<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>
Comments