- Apabila sobat belum menggunakan kode JQuery silakan copy kode JQuery berikut diatas kode </Head> pada template blog. Jika sudah ada kode JQuery di blognya silakan lewati langkah ini.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script> - Cari kode </Head> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di atas kode </Head> tersebut.
<style>
#buku_tamu {
position:fixed;_position:absolute;top:5px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
#buku_tamu:hover {
position:fixed;_position:absolute;top:5px; right:5px;
}
</style>
<script src='http://monozcore-project.googlecode.com/files/colorbox-min.js'></script>
<link href='https://sites.google.com/site/monozcore/home/fbPopup.css' rel='stylesheet' type='text/css'/>
<script type='text/javascript'>
jQuery(document).ready(function(){
$(".inline").colorbox({inline:true, width:"300px"});
});
</script> - Copy-paste kode di bawah ini pada bagian atau di bawah <Body> di kode HTML template blog sobat.
<div align='right' id='buku_tamu'>
<a class='inline' href='#bukutamu' title='Buku Tamu'><img alt='Buku Tamu' border='0' src='https://lh4.googleusercontent.com/-zBcQkdEpXkM/T1dub8XRthI/AAAAAAAABU8/rvj9VHOO3ig/s800/Buku%2520Tamu.png'/></a>
</div>
<div style='display:none;'>
<div id='bukutamu' style='padding:0px; overflow:hidden; background:#fff;'>
<center>
Kode script buku tamu disini....
</center>
<div style="padding-right:5px;text-align:right; font-size:60%;"><a href="http://arifinzyt.blogspot.com" style="text-decoration:none;color:grey;" target="blank">Get this widget</a></div>
</div>
</div>
- Keterangan :
| 
Blog Tools- Teks yang berwarna biru merupakan tempat untuk menaruh kode script buku tamu atau chatbox.
- Teks yang berwarna merah merupakan link URL gambar tombol. Pada postingan kali ini saya juga memberikan beberapa pilihan gambar tombol buku tamu.
- Klik "Save" dan lihat hasilnya...
Pilihan Gambar Tombol Buku Tamu :
https://lh4.googleusercontent.com/-28NQT1tb3KA/T1dub83RP0I/AAAAAAAABVM/nFXGjaGiZrY/s800/Buku%2520Tamu%2520Biru.png
https://lh4.googleusercontent.com/-kGDoh5HD3_g/T1dub0XVj5I/AAAAAAAABU4/xRwAujjjoLM/s800/Buku%2520Tamu%2520Hijau.png
https://lh4.googleusercontent.com/-zBcQkdEpXkM/T1dub8XRthI/AAAAAAAABU8/rvj9VHOO3ig/s800/Buku%2520Tamu.png
https://lh3.googleusercontent.com/-Z1fxhlvqeOM/T1ducoHlDLI/AAAAAAAABVE/AFtwHTnN9Hk/s800/buku%2520tamu.gif
https://lh6.googleusercontent.com/-6qlXHYzWTMU/T1duc2xbQhI/AAAAAAAABVI/NE_nP1mMakE/s800/bukutamu.gif
https://lh4.googleusercontent.com/-Dxsf5_XWLEM/T1dudaTvzqI/AAAAAAAABVc/D9P23mLWQP0/s800/crosbonz.gif
https://lh4.googleusercontent.com/-Jp9-bWJx-Z0/T1dud7-NefI/AAAAAAAABVg/DJzvhPbpQYA/s800/romaterlalusungguh.png
.: Semoga Bermanfaat :.
