FacebookProduk KesehatanMy Dollar $$$
Gratis berlangganan Artikel Satria PC, join here!
.
.
Satria PC is Dofollow Blog. Sertakan link sumber bila ingin Copy artikel Satria PC
Monday, July 11, 2011

7
Cara buat buku tamu Show/Hide (Floating Guest Box) pada Blogger

Share this artikel on :
Buku tamu atau Guest Box pada sudah banyak yang menggunakannya baik pada blog2 yang pernah saya kunjungi. Buat sobat Satria PC yang pengen pasang Widget Buku Tamu seperti Blog Saya, silahkan ikuti langkah berikut ini :


1. Masuk pada menu Rancangan /Elemen Laman
2. Klik Tambah Gadget / Add a Gadget
3. Pilih HTML/Javascript
4. Copy kode berikut dan paste pada HTML/Javascript tersebut

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

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="satriapc" src="http://www5.shoutmix.com/?satriapc" width="300" height="400" frameborder="0" scrolling="auto">
<a href="http://www5.shoutmix.com/?satriapc">View shoutbox</a>
</iframe>
<br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />
<!-- End ShoutMix -->
<br/>
<font color="#00FF00">Pengen pasang Buku Tamu kayak gini?</font><br/>
<font color="#00FF00">Klik di <a href="http://satria-pc.blogspot.com/2011/07/cara-buat-buku-tamu-showhide-floating.html"/><font color="#FF0000"> SINI</font></a>

[tutup]

</div>

</div>



<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Modifikasi Codenya :

Ganti code/tulisan yang berwarna biru dengan code ChatBox atau ShoutMix mu.

5. Klik Save.
6. Jadi deh... :) 

Mudah bukan?? Yuk pasang Widgetnya.

7 komentar: — Skip to Comment.

gembelusernya said...

mudah gan...tapi kok kayaknya berat tu gan..
tapi gak pa2 lah...ane cobak dulu gan

Satria PC said...

Sip gan, makasih udah mampir.

Lembidi said...

Weh gan link exchange ny mn?? nih kunjungin blog gua jg gan!! blog gua tentang bannering smua!! nih: http://wwwgamerindonesia-lembidi.blogspot.com/ Copy ja!! ke browser tabel ny!! Mantap gan cara ny!! tp ngilangin Percakapan ny Gmna??

Satria PC said...

@Lembidi : Code yang warna biru di atas diganti dengan kode Shout mix sobat

Teguh said...

makasi bnyk tutornya... di coba dlu ya... :D

Satria PC said...

@teguh : siip dah.. maksih dah mampir sob. Bsok2 mampir lagi ya :D

Teguh said...

Sukses... makasi bnyk ya infonya....
sip nanti mampir2 lg... :D

Post a Comment — or Back to Content

Silahkan berikan komentar, kritikan atau saran yang membangun untuk mendapatkan backlink gratis dari Blog Dofollow ini. Komentar yang tidak sesuai topik, SPAM, penghinaan etc. tidak akan saya tampilkan !

 

Statistik Pengunjung