Cara Mudah membuat guest book/buku tamu tersembunyi keren di blogspot

cara membuat buku tamu tersembunyi,hehhehe..
sobat mungkin udah pada banyak yang tau cara membuat 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..


  1. log in ke blogger
  2. pilih design/rancangan
  3. page elements
  4. pilih add gadget
  5. pilih tambah javascript/html
  6. 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('http://lh4.ggpht.com/_1j80TgNqd_8/TS3MlHxaygI/AAAAAAAABVo/P36anu_ToeA/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&amp;boxtag=w5wcvm&amp;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&amp;boxtag=w5wcvm&amp;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('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') 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>

demikian cara memasang buku tamu tersembunyi di blog.

You May Like :

31 Responses to "Cara Mudah membuat guest book/buku tamu tersembunyi keren di blogspot"

mita mengatakan...

haha makasi. mau coba ahh :D

topjer mengatakan...

wahhhhhh... ane dah buat tuh kang,, btw nice share

adrian mengatakan...

wah menarik nih sob..thanks ya dah sharing trik ini..jgn lupa jga komen balik di blogku ya

Berry Hardisakha mengatakan...

hahah..
silahkan2..
:)
thx all

Berry Hardisakha mengatakan...

@cityiklan:makasih ya

Ibnu Siswoyo mengatakan...

Terima kasih atas berbgi ilmunya.
Punya saya tak but di halaman postingan mas

Andhika mengatakan...

ini dia yg ane cari2 thx ya
http://dhikazal.blogspot.com/

Berry Hardisakha mengatakan...

@Andhika:silahkan sob..

Imen mengatakan...

nyoba2 ini gak pernah berhasil , coba pake caranya mas berry , sebelumnya thanks ya mas :D

kalo ada waktu iseng2 kunjungin blog saya ya

http://imenspanic.blogspot.com

Berry Hardisakha mengatakan...

@Imen:moga berhasil ya sob, jgn lupa kode merahnya diganti sama kode shoutmix punya sobat..

TEKINFO mengatakan...

ane coba dulu,gan..

Berry Hardisakha mengatakan...

@TEKINFO:siiip

Imen mengatakan...

nanya lagi hehehe , kalo pengen bikin guest booknya di sebelah kiri gimana mas ??

blogger biasa mengatakan...

ma kasih,,, mantap trik triknya kawand,, lanjudkan

Berry Hardisakha mengatakan...

@Imen:oke sobat,silahkan dicoba,,sudah saya update di postingannya..

Anonim mengatakan...

thank gw pinjem dlu ya...

Berry Hardisakha mengatakan...

siiip..
jgn lupa kode cbok merah diganti..

jagad misteri mengatakan...

dua duanya udah aku coba .... tapi masalahnya itu masalh menganggu tampilan iklan saya ... gimana sob solusinya...
mohon bantuannya..silahkan berkunjung kembali

http://gebyarmanusialangka.blogspot.com

Berry Hardisakha mengatakan...

@jagad misteri:ooo gitu, oke deh, coba buat nya disebelah kanan, kyknya bisa deh, sesuai kan aja ukurannya,,
saran saya iklan it tidak usah di buat melayang, menganggu pengunjung ntar lo...

Berry Hardisakha mengatakan...

@jagad misteri:di sesuaikan ukurannya sobat, di sebelah kanan bisa tu kyknya..

cerita rakyat mengatakan...

thankz infonya gan..
dicoba yah.. :D

Berry Hardisakha mengatakan...

@cerita rakyatsiiiip gan :)

iToru mengatakan...

Nice Info gan .,., mampir" ke Blog ane y .,.,

---------------------------
http://itoru-linux.blogspot.com/
-------------------------------

Berry Hardisakha mengatakan...

sama2 gan :)

arie5758 mengatakan...

sipps... mantap, ini yg sedang saya cari. sbb slot widget dah mulai kehabisan tempat... nice share :)

Berry Hardisakha mengatakan...

sedot gan :)

Cool Nick's mengatakan...

nice info gan thx

Alin Damay mengatakan...

Sudah Tak coba gan.. bagus.. trims infonya. :-)

simawar mengatakan...

Numpang Belajar yaa,,
baru buka blog nich..
Maaf yang trik kedua disimpan dikiri hasil gak berubah cuma jadi in english saja gann..
Info bagus gan...

Ray Ferdian mengatakan...

makasih sob atas tutorialnya. buku tamu sangat penting buat blogwalking

Maestro xcdo mengatakan...

mantabz gan :)
mapir jg k log ane ya
http://zorodesigner.blogspot.com/