Rabu, 08 Desember 2010

Buat CBox Unik Di Blogspot

Ingin buat Cbox seperti ini?





Dan ketika kamu klik hasilnya akan seperti ini :


















Mau tahu...???? Gampang koq caranya....

Nih aku tunjukin caranya ya.....


  1. Pertama-tama kamu buka situs cbox.ws.
  2. Trus kamu daftar di sana.
  3. Isi Cbox name dengan nama kamu. Ingat..!! Hanya huruf dan angka saja yang diperbolehkan, karakter lain seperti - _ + . , % * & dan sejenisnya tidak diizinkan.
  4. Trus isi Email adress dengan email kamu.
  5. Selanjutnya ketik Password dan konfirmasi password tersebut pada Confirm Password.
  6. Isi nama Website dengan nama blog kamu. Mis : syamsuqamaridji.blogspot.com.
  7. Lalu pilih bahasa (language) dan style yang kamu suka.
  8. Beri tanda centang pada I have read and do agree to the Cbox terms and conditions of service.
  9. Terakhir klik Create my Cbox.
  10. Selanjutnya kamu akan diminta untuk konfirmasi akun kamu di email yang kamu daftarkan tadi.
  11. Setelah kamu buka email kamu, klik aja lingk yang seperti ini : http://www.cbox.ws/admin.php?snippet
  12. Setelah kamu klik link tersebut, kamu akan diarahkan pada situs tersebut di tab baru.
  13. Setelah kebuka situs tersebut, kamu login dengan nama dan pasword kamu tadi.
  14. Sekarang kita akan mengatur tampilannya. Di posting ini aku hanya sekedar memberikan contohnya aja....ketika kamu praktekin bisa kamu sesuaikan dengan selera kamu.....
  15. Lanjut nih......kamu klik Menu Look & Feel. Pilih Layout Option. Disini kamu akan diminta untuk mengatur lebar (Width) tinggi (Height) dan tinggi form (Form Height) kamu. Kalo aku sih biarin aja begitu ukurannya....tapi sesuaikan aja dengan selera kamu...ok gan.
  16. Pada Form Layout, kamu ketik berapa jumlah baris tempat untuk mengetik pesan baru. Kalo punyaku, aku pilih 3 baris.
  17. Trus kamu klik Save.
  18. Klik kembali Menu Look & Feel. Pilih Style Presets....silahkan pilih aja mana style yang kamu suka...aku sih gak akan intervensi kamu...hehehe. Caranya klik aja pada gambarnya, lalu klik Confirm yang muncul pada gambar tersebut.
  19. Klik lagi Menu Look & Feel. kali ini kamu pilih Colours & Fonts. Atur aja gimana warna dan huruf yang kamu suka. Preview-nya ada di samping kiri. Setelah selesai memilih warna dan huruf yang kamu suka, klik Apply.
  20. Selanjutnya kamu klik Menu Options. Pilih Posting options, beri tanda centang pada Allow avatars dan Require CAPTCHA. jangan lupa klik Save.
  21. Buka kembali menu Options dan pilih Date Option. Nah disini kamu akan mengatur waktu tampilan. Tujuannya adalah menampilkan tanggal dan waktu dari setiap tulisan yang ditulis. Pada Format, kamu pilih format tanggal yang kamu suka atau bisa juga kamu abaikan karena format standarnya adalah format standar Indonesia. Untuk Time kamu pilih 24 hour. Lalu atur Zone. Lihat pada Example apakah waktu yang ditunjukkan sudah sesuai dengan waktu yang ada sekarang. Jika tidak, silahkan kamu pilih entah itu mau kamu tambah atau mau kamu kurangi, yang penting bisa sesuai dengan waktu kamu sekarang. Setiap kali kamu pilih zona waktu, maka dengan otomatis Example akan berubah. Trus kamu Save.
  22. Nah sekarang kamu pilih Menu Publish.
  23. Pada Step 2, kamu pilih variasinya menjadi Floating.
  24. Trus kamu copy code yang ada di bawahnya dan paste pada Teks HTML di Blog kamu.
  25. Eit..jangan langsung simpan ya, ini belum berakhir gan....karena kode HTML tersebut akan kita modifikasi sedikit.
  26. Setelah kamu paste pada HTML/Javascript, kamu cari kode seperti ini : cbbut.innerHTML = "Close Cbox";. "Close Cbox", bisa kamu ganti dengan kalimat lain sesuka kamu. Contoh : "Tutup" (tanpa tanda petik). Ingat !! Tulisan berwarna merah jangan dirubah, hanya tulisan berwarna biru saja.
  27. Trus cari kode : cbbut.innerHTML = "Open Cbox";, "Open Cbox" kamu ganti dengan kalimat yang kamu suka. Misalnya : "Klik disini untuk chatting denganku" (tanpa tanda petik). Atau bisa juga kamu ganti dengan nama "Buku Tamu" (tanpa tanda petik). Atau sesuka kamu lah.....
  28. Nah, ini langkah yang terakhir....udah bosan ya??? Sabar gan, ini udah langkah terakhir...hehehe.... Silahkan kamu cari kode background-color: #EDF3F7; border: #C3D7E5 dan kode background: #EDF3F7 serta kode border: #C3D7E5. Kamu ganti aja kode warnanya (tulisan berwarna biru) dengan kode warna yang kamu suka. Untuk kode warna bisa kamu lihat di posting aku yang berjudul Tips - Buat Tabel Dengan kode HTML.
  29. Klik simpan.....Selesai....mudah kan...???

Selamat mencoba.... Jangan lupa tinggalkan pesan atau komentarnya ya....!!!

1 komentar:

  1. makasi y tutorialny...salam kenal,,gw baru didunia bloger mhon bantuannya


    BalasHapus

Silahkan tinggalkan pesan, saran, kritik, maupun komentar anda demi kesempurnaan posting ini....!!!!