Cara membuat Guest Book keluar dari atas | Ahmad Bj Blogs

Selasa, 28 Agustus 2012

8 Cara membuat Guest Book keluar dari atas

Date: Selasa, 28 Agustus 2012 Selasa, Agustus 28, 2012
Category:
Author: Ahmad Bj Blogs
Share:
Responds: 8 Comment




Guest Book adalah salah satu cara agar pengunjung lebih komunikatif dengan blog kita, agar pengunjung blog sobat bisa meninggalkan jejak dengan cara meninggalkan pesan pada guest book tersebut, pada posting kali ini saya akan memberikan tutorila mengenai "cara membuat Guest Book yang keluar dari atas namun tombol untuk ngeluarin guest booknya bisa dari samping" biar tidak kecewa silahkan liat dulu Demonya, silahkan klik tombol Demo di samping




 namun sobat juga sebelumnya harus memiliki CBOX atau SHOUT MIX terlebih dahulu, untuk cara membuat CBOX silahkan sobat bisa mengunjungi tautan di samping ini


oke kalau sobat sudah memiliki chat box atau shout mix

silahkan ikuti tuutorial berikut ini

  • masuk ke blogger 
  • Masuk Rancangan ->  add gadget-> pilih HTML/java script
  • copy paste code berikut dan taruh di kotak HTML/javascript
klik show untuk melihat code

<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #999;
background: #6B86D0;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:http://i1148.photobucket.com/albums/o572/ahmadbj/GUESTBOOK111.png;">


<b><strike><!-- MASUKAN KODE CBOX/SHOUT MIX DI SINI --></strike>
</b>

</div>
</div>

<br />

<div style="position: fixed; bottom: 0px; right: 10px;width:150px;height:130px;">
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="http://i1148.photobucket.com/albums/o572/ahmadbj/GUESTBOOK111.png" alt="close" title="Click here to Close Cbox" /></a></div>

</div>


<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script></div></div>

Catatan:
  • Ganti kode warna merah dengan kode CBOX atau shoutmix anda
  • Anda bisa mengganti gambar Guest Book nya dengan Gambar lain dengan cara mengganti url gambar berwarna biru dengan url gambar keinginan anda, atau jika punya kereasi gambar sendiri anda bisa upload di photobucket atau lainya kemudian copy url nya dan masukin di kode warna biru


  • kemudian save
oke sob makasih atas kunjunganya, jangan lupa untuk berkomentar oke. :)
~Good luck~



Artikel Terkait :



8 comments

31 Agustus 2012 19.36

wah, boleh di coba nih.. thx ya.. n salam kenal.. :)
kunjungi balik ya ^_^

9 September 2012 16.16

oke sob aq kunjungi balik, salam knal jga

Anonim
29 Oktober 2012 17.51

fuyghasnnjksdf, ონლაინ კაზინო,
jhhgfhghsvda, online blackjack, cjuhfefbnzsdgsf,
online casino, kjfhjkgajhgd
Also visit my page ონლაინ კაზინო

2 Desember 2012 21.39

blog aku sngat jelek tolong ajarin dong
ne blog aku
http://wandipase.blogspot.com/

6 Januari 2013 21.23

thx gan informasinya
kunjungi blik ya
http://ayeadblog26.blogspot.co

27 Februari 2013 11.03

makasih sobat....mampir jg ya,,ane tunggu..

23 Maret 2013 07.58

terimakasih atas ilmunya,,semoga bermanfaat^_^

thankz ,,,,

kunjungi juga blog aq gan ,,
http//yantoevolutionz.blogspot.com

Poskan Komentar

untuk berkomentar:
1. setelah Anda membaca artikel ini anda wajib komentar
2. komentar anda sangat saya harapkan
3.komentar anda sangatlah penting demi kemajuan blog kita
4. komentar anda bagaikan berlian yang tak ternilai harganya
5. Cantumkan link blog anda apabila anda berkomentar, agar blog anda ikut naik trafic nya