19 Februari 2011

Membuat buku tamu blogger sembunyi di sisi blog

Buku tamu atau tempat untuk menulis komentar di blogger sangatlah berguna sebagai wadah untuk berinteraksi antara pengunjung dan si empunya blog. Tutorial semacam ini tentu sangat sering kita jumpai saat kita berkunjung ke blog-blog lain untuk mencari informasi. Sekedar mengingatkan kembali, berikut langkah-langkah untuk membuatnya:
  • Login ke blogger
  • Pilih tab rancangan, klik Tambah Gatget
  • Selanjutnya pilih HTML/JavaScript
  • Copas dan Simpan kode dibawah ini:



<style type="text/css">

#gb{
position:fixed;
top:140px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:220px;
width:32px;
float:left;
cursor:pointer;
background:url('http://i1089.photobucket.com/albums/i352/infokita1978/cooltext508153753.gif') no-repeat;
}
.gbcontent{
float:left;
border:5px solid #ff0000;
background:#000000;
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">

Masukkan kode Shoutmix/iklan anda disini

<div style="text-align:right">
<a href="javascript:showHideGB()">
<img src="http://i1089.photobucket.com/albums/i352/infokita1978/cooltext507237721.png" border="0" alt="Photobucket" /></a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div>

  • Jika sudah selesai, Save dan lihat hasilnya.

Catatan:
Ganti kode berwarna biru dengan url gambar anda
Ganti tulisan berwarna merah dengan kode Shoutmix/iklan anda.

Sekian dulu, semoga berguna. Salam.

Artikel Terkait Lainnya



7 komentar:

joko susilo mengatakan...

Ini yang membedakan antara blogger sejati dengan blogger copas (copy paste) artikel yang di buat berdasarkan pemikiran sendiri walaupun tema sama namun isi kalimat berbeda, keep posting until old.

lutvi avandi mengatakan...

Tips-tips dan artikelnya sangat membantu untuk sesama blogger, semoga menjadi blog yang besar ya sob.

blogodolar.com mengatakan...

Sepertinya anda sangat mendalami tentang hal ini (tentang isi blog khususnya blogspot, kapan-kapan saya akan datang lagi untuk membaca artikel-artikel anda yang bagus-bagus ini.

cosaaranda mengatakan...

wah ternyata pak joko dan mas lutvi juga ada di sini ya...hebat...blog ini menjadi tempat persinggahan para blgger kelas atas karena itu sangat rugi jika saya juga tidak ambil koment di blog ini, by the way nungu busway, bisakah buku tamunya tampil secara otomatis tanpa di klik setelah orang lain membuka blog beberapa saat ?

Info Kita1978 mengatakan...

@Pak Joko dan Mas Lutvi: Senang rasanya atas kunjungan anda berdua selaku blogger senior. Terus terang saya masih newbie yang masih harus belajar banyak, semoga saja apa yang saya posting bisa berguna buat orang lain. salam.

@Blogodolar.com: Terima kasih bos... yang saya sajikan disini adalah hasil dari percobaan beberapa script yang saya peroleh dari hasil jalan-jalan di blog lain dan saya coba praktekkan di blog sederhana ini sebagai tempat eksperimen dengan sedikit modifikasi. salam.

@cosaaranda: Trims gan dah berkunjung, untuk buku tamu yang tampil secara otomatis perlu sedikit modifikasi, saya coba ber-eksperimen dulu bos, nanti kalau dah selesai sekalian saya posting. salam.

aank budi santoso mengatakan...

ilmu baru nich maksih ya bos

Aank Budi Santoso mengatakan...

wah, makasih gan artikelnya !! sangat terbantu nech,. langsung praktek du lu gan ? jangan lupa mampir di blog saya juga y gan,.

Posting Komentar

PrevPage NextPage home