Create a guest book hidden

How to make a guest book is hidden, we know books tamukan yes guest book guest book to be filled by well now we make the guest book on your website or blog we see how easy the following steps
1. Login to blogger sign in with your account
2. Click the tab design and we've been on the next page element add the gadget you want diposisi
3. Furthermore, now you add the HTML / Javascript gadgets and paste the following code

<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/AVvXsEi-IKA4hhNJ8-4VnHElB2xZy5OBltDGl-V_sWA_DJ3vAcIwdD8Kj1Dc1HgIj1V1sXhPTd50U2BQoXHMX21vBjpQnXhwUVUmRUcuHrOrTu0KuqI3p2_IfbsrHy-M4WK8qppYvUI37QsTZvxp/') 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">

<!-- Replace the code in your guest book -->

<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>

Now add the code above into gadgets had to replace the red code with the code you get on shoutmik and if you do not have please register here
after the list and told to fill out the form and change the theme and view your shoutmix now you can menkopy shoutmix code from the code as below

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="blogprofesional" src="http://www5.shoutmix.com/?youridentity" width="160" height="400" frameborder="0" scrolling="auto">
<a href="http://www5.shoutmix.com/?youridentity">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 -->

Example



ShoutMix chat widget
and paste the code shoutmix with a combination of the above code so that it can be seen hidden

I Suggest You Also Read