Sabtu, 22 Desember 2012

Membuat Buku Tamu Tersembunyi Pada Blog

Buku Tamu
Membuat Buku Tamu Tersembunyi Pada Blog - Kebetulan ada waktu buat posting, kali ini saya akan memberikan sedikit tips dan trik untuk membuat buku tamu yang tersembunyi pada bagian samping blog sehingga bisa sedikit menghemat halaman blog kita. Artikel kali ini juga bertujuan untuk menambah beberapa tips dan trik yang telah saya sampaikan dalam blog ini. Untuk contoh BUKU TAMU yang tersembunyi pada blog bisa sahabat lihat pada bagian samping atas blog ini silahkan sobat klik dan isi juga boleh. Silahkan ikuti langkah berikut untuk Membuat Buku Tamu Tersembunyi Pada Blog


Langkah Awal:
1. Pertama-tama sobat harus terlebih dahulu mempunyai chatbox yang akan digunakan sebagai buku tamu seperti cbox, soutmix, chatbox. Pada blog ini saya menggunakan Chatwing. (sebelumnya saya pernah menggunakan yang lain namun lama-lama chatbox error, semoga Chatwing tidak dan juga pada Chatwing untuk pendaftarannya sangat mudah).
2. Jika sudah mendaftar maka kita akan mendapatkan kode HTML untuk embed file chatbox sehingga bisa muncul di blog kita. 
Contoh Kode :
 <!-- Begin http://chatwing.com chatbox -->
<iframe src="http://chatwing.com/chatbox/22e09790-4c13-11e2-8dd3-xxxxxxxxxxx" width="240" height="424" frameborder="0" scrolling="no">
  Please contact us at support[at]chatwing.com if you cannot embed the code
</iframe>
<!-- End http://chatwing.com chatbox -->
3. Simpan, Copy dan pastekan kebagian Kode yang berwana Merah pada Langkah selanjutnya dibawah ini.

Langkah Selanjutnya:
1. Masuk ke akun blog sahabat.
2. Kemudian Pilih Tata Letak
3. Tambah widget >> Pilih HTML/Javascript
4. Masukkan kode dibawah ini pada widget HTML/Javascript tadi.
5. Simpan, dan selesai
Kode :

<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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK-1fMFj38VAz_mlruh8ZEa-bN_W_sSZZUEUMCsdrFodZLlHVWc15qF6f-IhC_Xz0rBfv_Uw30bh0i2oBM_TQU_2utsEHeIBwF03P685ZgZF-qclvXz9Iq8sQs89XdupRKcQSpinRa0IM/s1600/buku+tamu.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">
  
---------------- Kode Chatbox Yang Sahabat dapat disini -----------------

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


Keterangan :
Warna Ungu = Sahabat bisa ganti dengan alamat gambar tulisan buku tamu.
Warna Biru = Sahabat bisa sesuaikan dengan warna blog sahabat
Warna Merah = Link/Kode yang sahabat dapatkan dari penyedia layanan chatbox (seperti yang saya gunakan layanan Chatwink).

Sekian sedikit tips dan trik cara Membuat Buku Tamu Tersembunyi Pada Blog semoga bermanfaat.

Artikel Terkait Lainnya :

TERIMA KASIH ATAS KUNJUNGAN SOBAT CERIA PADA ARTIKEL INI
Judul: Membuat Buku Tamu Tersembunyi Pada Blog
Ditulis oleh Ery || Rating Blog 5 dari 5
Semoga artikel ini bermanfaat bagi Sobat ceria. Jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi artikel ini dengan segala rasa hormat harap menyertakan link dofollow ke https://pemula-awaliharimu.blogspot.com/2012/12/membuat-buku-tamu-tersembunyi-pada-blog.html?m=0. Sekali lagi Terima kasih sudah berkenan membaca artikel ini. smile
If You Like This Article Share it:

9 komentar:

  1. nice info gan .. bermanfaat! ..

    Blog sudah saya follow , follow balik ya gan! :)

    Disini gan » Kang Rian

    BalasHapus
    Balasan
    1. oke gan... sudah di follow juga,, thanks...

      Hapus
  2. mau cobat menambahkan ke blog ane ah.. buku tamunya

    BalasHapus
  3. Sudah saya pasang gan..
    follow balik ya :
    mnafarin.blogspot.com

    BalasHapus
  4. Komentar ini telah dihapus oleh administrator blog.

    BalasHapus
  5. Sangat membantu gan infonya buat saya pribadi. terimakasih sebelumnya ya gan sudah share artikel ini.

    BalasHapus
  6. Waduh, kyk gini aja saya gak bisa... tak minum Susu Kambing dulu, biar tambah paham...
    Terimakasih manfaat banget artikelnya

    BalasHapus

Tinggalkan Jejak Petualangan Dunia Maya SOBAT di dalam blog ini dengan menyempatkan diri sejenak untuk saling sapa ataupun berkomentar.
*Budayakan saling menghargai dan berkomentarlah yang baik.*

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Bloggerized by Blogger Tip and Trick - Premium Blogger Themes