Buku Tamu Versi New ( Shoutbox / CBOX ) Pada BLOG kita

Selamat malam semua nya. Akhir nya hari ini saya bisa posting lagi tentang tips blog. Sebenarnya sih tips ini saya copy dari Kang Dada...

Selamat malam semua nya. Akhir nya hari ini saya bisa posting lagi tentang tips blog. Sebenarnya sih tips ini saya copy dari Kang Dadang tapi tidak semua nya saya ambil karena sudah saya edit kembali. Tips kali ini tentang Cara Membuat Buku Tamu Keren V.3. Ok deh karena saya tidak mahir menulis langsung saja ke cara membuatnya. Ikuti langkah berikut ini :

1. Login ke blogger
2. Pada Dasbor >> Rancangan >> Elemen Laman
3. Klik Tambah Gadget, kemudian pilih HTML/Javascript
4. Copy kode berikut ini

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){

    $(".gbbtn").click(function(){

        $("#gbcontent").slideToggle("slow");

        $(this).toggleClass("active"); return false;

    });

});

</script>

<style>

/* ---------------

by  : Palm_Ben_Astro

edited by : Palma_Hutabarat

---------------------------------- */

.gb {

position:fixed;

top: 0px; right:450px;

z-index:+1000;

}

#gbcontent {

    height: auto;

    background: #898787;

    width: auto;

    display: none;

    padding: 10px;

    border:4px solid  silver;

background:url(http://i51.tinypic.com/rcq4b7.gif) #000000 repeat-y center;

   -webkit-border-radius: 15px;

-moz-border-radius: 15px;

border-radius: 15px;

    padding:10px;

}

.gbbtn {

    position:fixed;_position:relative;top:50px; right:0px;

    clip:inherit;

    _top:expression(document.documentElement.scrollTop+

    document.documentElement.clientHeight-this.clientHeight)

}

.active {

    background-position: right 12px;

}

</style>

<div class="gb">

<div id="gbcontent">

KODE CHATBOX KAMU</div>

<br />

<div align="right"><font size="2"><a href = "http://www.palmahutabarat.co.cc/2012/10/buku-tamu-versi-new-shoutbox-cbox-pada.html " target=_blank"><div style="color: #000;">

<span style="font-size: x-small;">:: Get This Widget!! ::</span></div></a></font></div>

<div id="gbbtn"><a href="#" class="gbbtn" title="Buku Tamu"><img alt="Buku Tamu" heigth="125" src="http://i1042.photobucket.com/albums/b429/Farix_2010/Chatting.png" border="0"style="cursor:pointer;style=" opacity:1;filter:alpha(opacity="100)&amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; quot;" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50"  /></a></div></div>