Tips and Trick Blogger

How to Create a Guest Book Hidden

For those who want to make this hidden Guestbook is the tutorial:

1. go to Blogger

2. Go to Layout and select the gadget and enter the html code below in the gadget box, eitz do not forget to replace the green paper with the code   shoutmix / cbox you.

    <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/AVvXsEjItHVdTauZIYWTo4dFHw1S5n0q6fIw1o8th6Zs4BLPFdRjmG9wQEDMSnjDY0CvFDx1X5u2hIq03BBuqtLAudaWdLnfs03gM37x3HG902wbaQP-viieiedmQGLZzkt0Xtb9jdcd1LFVYMNE/') 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></div></div>

3. And Then, Save Template