Home » » Cara Membuat Buku Tamu Di Blog Gratis Terbaru

Cara Membuat Buku Tamu Di Blog Gratis Terbaru


Buku tamu / Guest book adalah widget yang lumayan penting di blog karena dapat berfungsi untuk chatting / komunikasi baik dengan pengunjung ataupun untuk para blogger yang biasanya ingin blogwalking / meninggalkan jejak dengan menaruh link blognya di buku tamu agar bisa saling mengunjungi dan pastinya juga bisa menambah traffic blog sobat. Gadget buku tamu yang biasa dipakai pada blogger, wordpress maupun website adalah cbox, shoutbox dan shoutmix, tapi disini kita akan membuat guest book tersebut dengan menggunakan cbox yang keren, mudah digunakan dan free tanpa bayar.

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

Kali ini saya akan share dan jelaskan gimana Cara Membuat Buku Tamu Di Blog Gratis Terbaru, silahkan ikuti tutorial langkah - langkah berikut lengkap beserta gambarnya dengan mudah dan cepat buat sobat yang ingin pasang guest book pada blogspot.

Cara Memasang Buku Tamu Di Blog Terbaru :

1. Pertama sobat bisa mendaftar / daftar akun cbox dengan cara buka situs web www.cbox.ws lalu klik Sign up

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

2. Kemudian isi kotak pendaftaran seperti cbox name (tidak boleh pakai spasi), email address (alamat email), password, confirm password dan website sobat serta centang "I agree to the Cbox terms and cconditions of service" jika sudah klik Create my Cbox!

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

3. Cbox Created, akun sobat telah terbuat lalu klik Log in untuk masuk ke dalam Cbox

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

4. Setelah itu masukkan Account name dan password yang tadi baru dibuat lalu klik Log in

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

5. Maka akan muncul halaman cbok sobat lalu scroll ke bagian bawah untuk mendapatkan kode nya

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

6. Berikut embed code cbox, silahkan copy kode tersebut

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

7. Kemudian masuk ke blogger sobat lalu klik Laman baru pada Menu Laman / Pages untuk membuat buku tamu di halaman blog

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

8. Isi Judul lalu klik mode HTML dan masukkan kode cbox sobat ( yang di kotak biru untuk mengatur lebar silahkan ganti menjadi 280px atau sesuai yang diinginkan ), jika sudah klik Publikasikan

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

9. Maka halaman guest book sobat telah terbuat klik Lihat untuk melihat hasilnya

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

10. Selain membuat buku tamu cbox di halaman blog, sobat juga bisa menaruh / meletakkan widget tersebut pada sidebar atau footer blog dengan cara pilih Menu Tata letak lalu pada bagian sidebar / footer klik Tambahkan Gadget

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

11. Maka akan muncul tampilan berikut lalu klik tombol tambah pada HTML/JavaScript

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

12. Kemudian isi judul dan masukkan kode cbox sobat lalu klik simpan maka buku tamu cbox akan tampil di sidebar / footer blog sobat

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

13. Atau sobat juga bisa membuat buku tamu tersembunyi pada samping kanan blog dengan cara seperti di atas masuk ke Menu Tata Letak > klik Tambahkan Gadget pada bagian footer > pilih HTML/Javascript kemudian untuk judul tidak usah diisi lalu masukkan kode di bawah ini (ganti tulisan warna biru dengan kode cbox milik sobat) jika sudah klik Simpan

<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.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">
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
Code cbox milik sobat
<!-- END CBOX -->

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


14. Terakhir klik Simpan setelan.. Selesai

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

Nah itulah bagaimana cara membuat buku tamu di blogspot dengan menggunakan cbox pada halaman blog, sidebar / footer dan auto hide di samping blog, tinggal pilih mana yang sobat sukai.

Silahkan dicoba

Artikel Lainnya :

26 komentar:

  1. Makasih gan artikelnya ...ini cara pasang buku tamu yang lengkap tutornya...jangan lipa kunjungan balik ya gan....

    ReplyDelete
    Replies
    1. iya gan harus lengkap supaya jelas, oke

      Delete
  2. asik isi nya sangat menarik
    dan sangat menghibur
    thanxs gan

    ReplyDelete
    Replies
    1. ya gan pastinya harus menarik agar lebih SEO

      Delete
  3. Ada tidak cara lain mas, maksud saya tanpa widget dari pihak ketiga?

    ReplyDelete
    Replies
    1. sepertinya tidak ada mas yang tanpa pihak ketiga, kalau untuk cara lain bisa menggunakan shoutbox

      Delete
  4. makasih gan infonya
    mampir ke blog ane juga :)
    http://howtomanner.blogspot.co.id

    ReplyDelete
  5. Replies
    1. sama2 gan, mkasih bnyak jg dah berkunjung

      Delete
  6. tutorialnya sangat membantu hehe.makasih yaaaa:)

    ReplyDelete
    Replies
    1. oke sis, senang bs membantu tutorialx :)

      Delete
  7. makasih gan,,,wah bermanfaat banget nie....

    https://officelistrik.blogspot.co.id/

    ReplyDelete
  8. Tutorialnya sangat bermanfaat sekali, terutama untuk yang sedang mengembangkan bisnis

    Salam kenal dari Konsultanblog

    ReplyDelete
    Replies
    1. Bermanfaat gan tutorialnya.. oke salken jg dri CaraZain

      Delete
  9. Penjelasannya lengkap dan tutorialnya mudah dimengerti

    ReplyDelete
  10. Manteb banget bos!! Kayaknya cocok buat chat sama pengunjung!!

    ReplyDelete
  11. terima kasih infonya gan. saya blogger baru butuh banyak info seperti ini..

    ReplyDelete

Powered by Blogger.