How to Create a Guest Book On Blogspot

How to Create a Guest Book - Guest Book is a means to establish communication between the visitors. With have a guest book so we can monitor the traffic and greet share. Actually, this trick has long existed. But because there are some friends who asked, here's a trick I love to make a guest book that has a floating effect.

Here is how:

A. Login to your Blogger dashboard
2. Add a gadget. Choose HTML / JavaScript
3. Enter the following coding

<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/AVvXsEj_n-5fy7xDiyAngUVpwCe3LD8-Cpqm5Ox90BvJhl_6MrOEnurzj_kg7AebcPRlmw3zjg_XBGRFvJF8Dws3AF8kSydj4ndTQXKN9Gk2JPYXzUtPCPL8FfW6qvIC-J_8EGal1PQjcuL8yFXH/') no-repeat;
}
. gbcontent {
float: left;
border: 2px solid # A5BD51;
background: # F5F5F5;
padding: 10px;
}
</ style>

<script type="text/javascript">
showHideGB function () {
var gb = document.getElementById ("gb");
var w = gb.offsetWidth;
gb.opened? moveGB (0, 30-w): moveGB (20-w, 0);
gb.opened =! gb.opened;
}
moveGB function (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 the guest book buddies ->


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

4. Save and view results