23/08/10

Cara Membuat Shoutmix Menjadi Tersembunyi


Berbagai cari dilakukan untuk menghias blog kita agar semenarik mungkin, contohnya dengan menambahkan SHOUTMIX (Buku tamu), akan tetapi bagaimana cara membuat shoutmix tersebut menjadi lebih menarik?....kita dapat membuatnya menjadi tersembunyi.
Langsung aja ke caranya:

1. Masuk ke account Blogger kamu, pilih Layout; kemudian Page Elements;
2. Klik "Add a Gadget" (yang mana aja oke), kemudian pilih "HTML/JavaScript",
3. Copy-paste COPAS kode di bawah ini:

<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('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">
<!-- Ganti ini dengan kode buku tamu kamu -->
<br/>
Mau seperti ini?<br />
Click disini--->
<a href="http://sidiq-good-boy.blogspot.com/2010/08/cara-membuat-shoutmix-menjadi.html">
Blog Tutorials


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

Pada kode di atas, cari kode <!-- Ganti ini dengan kode buku tamu kamu --> dan ganti kode tersebut dengan kode buku tamu yang kamu punya, buku tamu dapat dicari lewat google dengan keyword CBOX, untuk ukuran dan posisi kalian dapat kembangkan sendiri.

Silahkan komen apabila mendapat kesulitan ataupun kesalahan

11 komentar:

  1. pertamaz gan..langsung coba yah ...

    BalasHapus
  2. sip infonya sob,dak coba langsung

    BalasHapus
  3. akan membuat tampilan blog makin keren yaaa ")

    BalasHapus
  4. hmmm buat blog jadi berat gak

    BalasHapus
  5. engga ko, kalo blog jadi lambat coba aja di CSS COMPRESOR untuk nurunin kinerja blog, jadi lebih cepat progressnya

    BalasHapus
  6. Kebetulan saya juga pake CHatBox seperti ini sob, jadi menghemat tempat dan pastinya makin keren blog kita,,,,,

    BalasHapus
  7. Thanks, Sohibku... Cbox CahNdeso sekarang posisinya sama dengan punya kamu. Tolong di link balik yaaa... punya kamu kan sudah ada di Cbox, yeee....>>> thanks alot!!

    BalasHapus
  8. cara menghapusnya dimana ya ? soalnya di page element mau dihapus , gak ada .. pengen ganti ama cbox ini..

    BalasHapus
  9. makasih bwt infonya

    BalasHapus

Related Post


Mau seperti ini?
Click disini---> Blog Tutorials