.hrecipe{font:1px oswald;} .jqueryslidemenu{ font: bold 12px Trebuchet MS; background: #414141; width: 100%;}

Memasang Cbox tanpa mengganggu loading

Bookmark and Share
Saat ini akan sedikit membahas tentang Memasang Cbox tanpa mengganggu loading dan semoga artikel ini bermanfaat buat sobat yang mampir di blog ini, bila berkenan setelah membaca artikel ini sobat bisa meluangkan untuk meninggalkan jejak pada kotak komentar dan Insya Alloh saya akan berkunjung balik ke blog/web sobat sebagai tanda terima kasih saya atas kunjungannya.

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.

Sumber: http://azzam10.blogspot.com/2012/09/memasang-cbox-tanpa-mengganggu-loading.html


{ 0 comments... Views All / Send Comment! }

Post a Comment