Membuat Buku Tamu Slide, Unik, Keren (terbaru) di Blog

Membuat Buku Tamu Slide, Unik, Keren (terbaru) di Blog

Artikel kali ini adalah pesanan dari sahabat bloger saya, dia meminta saya agar di buatkan tutorial "Buku Tamu yg nempel di dinding" hehehehhe!! Sebenarnya punya saya itu hasil nyolong di blog orang kemudian saya rombak sendiri Cuman nyuri kodenya duank :D hehehhehe, tetapi lupa nyolongnya dimana (kalau ada yang merasa sebagai penciptanya saya berterima kasih dan minta maaf juga heheh )..,,

Fungsi dari buku tamu yang nempel di dinding ( cicak kaleeeee ) atau saya menamakannya Buku Tamu Slide adalah untuk mengirit tempat di blog sobat. Langsung saja cekidot dot

1. Seperti biasa pertama-tama login ke Blog sobat, jangan ke Facebook.

2. Klik tata letak atau layout.

3. Pilih Edit HTML.

4. Sebelum memulai pengeditan alahkah baiknya sobat membackup data sobat terlebih dahulu, caranya pilih Download Template Lengkap.

5. Cari kode ]]></b:skin> agar lebih mudah sobat bisa menekan Ctrl + F, kemudian paste kode tersebut di sebelah tulisan Find.



6. Copy code di bawah kemudian paste di atas kode ]]></b:skin>


#chat{position:fixed; top:20px; z-index:+1000}
* html #chat{position:relative}
.chat-click{height:191px; width:53px; float:left; cursor:pointer; background:url(URL TOMBOL) no-repeat;}
.chatbox{float:left; border:0px solid #; background:  #faeba8 ; padding:25px 0 50px 25px}
.chatbox a {text-decoration: none;}

Catatan :
  • Tulisan yang berwarna orange adalah jarak atas kotak surat 
  • Kode yang berwarna hijau adalah lebar dan tinggi dari tombol slide
  • Tulisan yang berwarna merah itu diganti dengan url gambar tombol milik sobat
  • Tulisan yang berwarna biru adalah kode warna dari background Buku tamu milik sobat, jika sobat ingin menggantinya dengan gambar tinggal menyisipkan kode ini url(link background sobat letakkan disini)no-repeat
7. Simpan Template.

8 Kembali ke Elemen Laman.

9. Pilih HTML/JavaScript  , kemudian masukkan kode di bawah.

<script type="text/javascript">
function showHidechat(){
var chat = document.getElementById("chat");
var w = chat.offsetWidth;
chat.opened ? movechat(0, 30-w) : movechat(20-w, 0);
chat.opened = !chat.opened;
}
function movechat(x0, xf){
var chat = document.getElementById("chat");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
chat.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("movechat("+x+", "+xf+")", 10);}
}
</script>
<div id="chat">
<div class="chat-click" onclick="showHidechat()"> </div>
<div class="chatbox">
<center>


MASUKKAN CODE CBOX, ATAU  CODE LAIN DARI PROGRAM PESAN LAIN DISINI

</center>
<span style="float:right">
<a href="javascript:showHidechat()">
close
</a></span>
</div></div>

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

catatan :
Untuk mendapatkan code program pesan silahkan kunjungi alamat dibawah ini dan daftar :
http://www.shoutmix.com/
http://shoutcamp.com/


10. Simpan (pelengkap :D)

Kalau ada kesalahan tolong dikoreksi.
Terima kasih atas pesenannya, heheh mayan nambah jumlah artikel.

Artikel Dilindungi
by Rafi Aldiansyah Asikin

14 komentar

  1. Which came first? chicken or the egg

    BalasHapus
  2. Which team do you prefer, Manchester United or Manchester City?

    BalasHapus
  3. bang cara tau chatbox kita g mana...?

    BalasHapus
  4. Mas Arief : Kita buka situs yang kita gunakan untuk Cbox kita, mas..
    Daftar situs diatas silahkan dibuka

    BalasHapus
  5. Apa enaknya ya kalau blog dipasang chat box begini, menarik gak ya kira-kira. Nanti saja nunggu penjelasannnya mas rafi, kira-kira gimana. Kalau bagus saya pasang.

    BalasHapus
    Balasan
    1. Tergantung penempatannya mas, tp lebih baik komentar yang sebenarnya seperti ini saja. Soalnya Buku tamu biasanya banyak spamnnya

      Hapus
  6. Buku tamu ini seperti tamu masuk keblog ntar bisa chat atau gimana ya ? kok ngga ada demo :(

    BalasHapus
  7. mantap dah artikelnya mau saya coba gan
    http://ow.ly/EmVJu

    BalasHapus
  8. wah keren .. ga kaya buku tamu saya yg usang, hufftt .. maklumlah newbie, hehe
    http://rumahkita.net/guestbook

    BalasHapus
    Balasan
    1. Wah keren ko mas :) hehe :D thank's sudah kemari :)

      Hapus
  9. pagerank nya brp ini mas blognya, tertarik ngiklan neh hehe

    BalasHapus
    Balasan
    1. Silahkan mas barangkali berminat hubungi kontak saja mas. Pagerank bisa cek sendiri mas hehe :D

      Hapus

Komentar anda sangat dibutuhkan bagi kemajuan kami untuk terus berkarya.
Diharapkan :
* Berkomentarlah dengan bahasa yang baik
* Tidak ada unsur SARA, SPAM, PORNO
* Tidak merugikan orang lain
* Menunjukkan identitas yang jelas bukan Anonim

Diperkenankan :
* Komentar promosi link web anda
* Kritik & Saran

[Protected] by DMCA Protection Pro™
EmoticonEmoticon