Jumat, 21 Oktober 2011

Cara Membuat Buku Tamu / Guest Book

Jika anda bosan dengan tampilan buku tamu milik orang lain anda bisa membuat nya sendiri membuat nya juga cukup mudah. Jika anda ingin membuat nya anda tinggal ikuti langkah nya di bawah ini.



1.Klik Design.
2.Klik Page Elements
3.Klik add a gadget.
4.Klik HTML/javascipt.
5.Copas html ini.

<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://lh5.googleusercontent.com/-G-D1lyZm_to/TYOIi7Hix_...) no-repeat;
}
.gbcontent{
float:left;
border:2px solid #00cefa;
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://www2.cbox.ws/box/?boxid=2173118&amp;boxtag=n9jznn&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#ababab 1px solid;" id="cboxmain"></iframe></div>
<div><iframe frameborder="0" width="200" height="75" src="http://www2.cbox.ws/box/?boxid=2173118&amp;boxtag=n9jznn&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#ababab 1px solid;border-top:0px" id="cboxform"></iframe></div>
</div>
<!-- END CBOX -->

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

Ganti yang berwarna merah dengan link gambar Buku tamu anda
Ganti yang hijau dengan shoutmix atau shautbox kamu

Kalau mau gambar yang hasil edittan saya save aja gambar di bawah ini dan upload






Jika inggin bikin atau edit pake aja photoshop untuk download photoshop klik disini.
Kalo mau ganti warna border edit yang ini border:2px solid #00cefa;
Kalo backgroun yang ini background:#F5F5F5;

Selamat Mencoba!