Memasang Cbox tanpa mengganggu loading

Salam sukses selalu buat sobat semua, Belajar Komputer Melalui Internet saat ini akan sedikit membahas tentang Memasang Cbox tanpa mengganggu loading dan semoga artikel ini bermanfaat.


Memasang Cbox tanpa mengganggu loadingMemasang Cbox tanpa mengganggu loading, maksudnya yaitu memasang Cbox dengan menggunakan iframe sehingga Cbox tersebut akan diload hanya jika diklik saja sehingga tidak mengganggu loading pada awal membuka blog. cara ini sebenarnya sudah disediakan oleh pihak Cbox namun bagi sebagian besar pengguna Cbox cara ini jarang yang menggunakan.
sebelum berlanjut pada cara tersebut mungkin sobat yang belum memasang Cbok bisa baca cara daftar Cbox point pertama di Membuat Buku Tamu Show/Hide.
Buat sobat yang sudah memasang Cbox agar lebih jelasnya cara kerja hasil pemasangan Cbox seperti yg dimaksud bisa dicek dengan melihat status bar yang ada dibagian bawah browser mozilla, dimana sobat bisa refresh halaman blog sobat kemudian perhatikan status barnya, kalau belum memasang cara seperti ini maka pada status bar tersebut akan terlihat URL Cbox. apabila kondisi koneksi kita sedang jelek maka loading Cbox tersebut sangat berat sekali dengan ditandai dengan kata menunggu http://www6.cbox.com/ pada status bar atau terkadang ada peringatan tidak bisa menghubungi situs tersebut sehingga kotak cbox tersebut tidak berfungsi. Nah kalau menggunakan cara ini maka loading Cbox tersebut hanya akan dilakukan manakala kita mengklik Cbox tersebut. coba saja sobat perhatikan Cbok blog ini pertama-tama refresh dulu halaman blog ini kemudian perhatikan status bar, pasti tidak akan meload cbox karena menggunakan cara ini. selanjutnya sobat klik Chatbox yang ada di sebelah kanan bawah blog ini dan perhatikan, kalau kondisi koneksi sedang jelek maka status bar akan kelihatan namun kalau koneksi baik maka status loadingpun nyaris tidak kelihatan karena cepat. begitu penjelasan cara ini dan selanjutnya langsung ke pokoknya;
  • Login ke Cbox 
  • selanjutnya klik publish
  • Pada halaman publish perhatikan pada step 2 : Choose a variation.
  • Klik tombol dan pilih Floating Button
  • Copy kode yang ada pada kotak
  • Kemudian ganti kode Cbox sobat dengan kode tersebut. 
  • Simpan dan lihat hasilnya.
Bila Tampilannya tidak sesuai dengan keinginan sobat maka sobat bisa mengaturnya dengan mengganti kode CSS pada kode tersebut. perhatikan contoh berikut:
<div id="cboxbutton" style="position: fixed; bottom: 8px; right: 16px; width: 200px; padding: 3px; text-align: center; cursor: pointer; background-color: #EDF3F7; border:#C3D7E5 1px solid;border-radius: 3px; font-family: Tahoma, sans-serif; font-size: 14px;" onclick="togglecbox()"><b>Open Cbox</b></div>
<div id="cboxdiv" style="display: none; position: fixed; bottom: 48px; right: 16px; width: 200px; background: #EDF3F7; padding: 3px; line-height: 0;border:#C3D7E5 1px solid;border-radius: 3px;"></div>
<script type="text/javascript">
var cbvis = false;
var cbload = false;
var cbcookie = "cboxvis=";
function togglecbox () {
    var cbdiv = document.getElementById("cboxdiv");
    var cbbut = document.getElementById("cboxbutton");
    if (!cbvis) {
        if (!cbload) {
            cbdiv.innerHTML = '<iframe frameborder="0" width="200" height="305" src="http://www7.cbox.ws/box/?boxid=452937&amp;boxtag=nf3ngq&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain7-452937" style="border:#333333 1px solid;border-bottom:0px" id="cboxmain7-452937"></iframe><iframe frameborder="0" width="200" height="75" src="http://www7.cbox.ws/box/?boxid=452937&amp;boxtag=nf3ngq&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform7-452937" style="border:#333333 1px solid;border-top:0px" id="cboxform7-452937"></iframe>';
            cbload = true;
        }
        cbdiv.style.display = "block";
        cbbut.innerHTML = "Close Cbox";
    }
    else {
        cbdiv.style.display = "none";
        cbbut.innerHTML = "Open Cbox";
    }
    cbvis = !cbvis;
    document.cookie = cbcookie+((cbvis)?1:0);
}
// Toggle Cbox open if it was previously
var cbcookiei = document.cookie.indexOf(cbcookie);
if (cbcookiei >= 0) {
    if (document.cookie.substring(cbcookiei+cbcookie.length, cbcookiei+cbcookie.length+1) === "1") {
        togglecbox();
    }
}
</script>
Sobat bisa atur kode yang ada;
  • yang ada pada warna paling atas adalah kode untuk mengatur tombol Cbox.
  • yang ada pada warna kedua adalah kode untuk mengatur tata letak kotak form Cbox.
  • yang ada pada warna ketiga adalah kode untuk mengatur Cboxnya yang terdiri dari kotak komentar dan kotak isian komentar.
  • Tulisan berwarna biru bisa diganti dengan kata-kata sobat.
Selesai.. semoga berhasil.

Mungkin sampai disini dulu Belajar Komputer Melalui Internet tentang Memasang Cbox tanpa mengganggu loading kali ini, semoga bermanfaat bagi Anda.

DAPATKAN ARTIKEL VIA EMAIL

Masukan Alamat Email Sobat:

Delivered
feedburner

Dipublish oleh : Abdul Kohar - Jatinangor Rating 5 Belajar Komputer Melalui Internet, Updated at: 01:11

9 komentar :

  1. Balasan
    1. selama ini saya sering ganti tampilan namun semua itu masih satu template, cuma dimodif aja CSSnya terkadang peletakan CSSnyapun ada yg ga beraturan atau acak-acakan sehingga buat share pada sobat-sobat sy masih ragu taku ngecewain..karena akan rumit nantinya dan hasilnya tidak memuaskan. mungkin kedepan akan sy coba bikin template dan di share buat sobat-sobat blogger..

      Hapus
  2. Wahhh mantef nih bang Kohar tutornya,trims ya bang.

    BalasHapus
  3. . . aq udah gak pake cbox,, cz aq takut gak bisa membalas kunjungan. jadi aq tiadakan daripada pengunjung blog aq kecewa. he..86x . .

    BalasHapus
  4. mas , cara membuat chat box , followers , dan feedjit hiden seperti di blog mas gimana ? tolong share donk mas :D hehehehe (ngarap)

    BalasHapus
Silahkan Tinggalkan jejak sobat, bila mau menggunakan emotion silahkan klik emotionnya kemudian copy dengan ctrl+c dan paste kodenya didalam kotak komentar...

close
GUESTBOOK
Google PageRank Checker Powered by  MyPagerank.Net
backlink
Dashboard
| Copyright © 2012 |
| Belajar Komputer Melalui Internet |
| Desain by: Abdul Kohar | Powered by: Blogger |