Bikin Widget Installer sekali klik

Pasti banyak pembaca yang penasaran, bagaimana sih bikin widget-installer sekali klik ? Ok, mari kita mulai, pertama-tama lu harus ngerti dulu cara kerjanya, jadi ntar lu gampang bikin punya lu sendiri. Perhatian: copy-paste doang kaga bakal bisa coy !

Langkah 1: Bikin sebuah Widget
Kalo lu pingin bikin sebuah Widget Installer, elu harus bikin satu widget itu sendiri dulu. Satu widget-installer sekali klik yang bisa diinstal harus berisi semua code yang diperlukan. Jadi kalo misalkan lu punya kode javascript yang mesti diinstal, coba elu tarok di dalem widget dulu. Ok, sekarang buat lucu-lucuan dulu, mari kita bikin Widget kata-kata mutiara acak ( trims Annie). Buka template Blog elu, tambahin elemen HTML/Javascript yang dibutuhkan, ganti judulnya misalkan dengan "Kata Mutiara", dan tambahin javascript dibawah ini buat isinya :

Kode diatas adalah script javascript . Jangan cemas, gampang dimengerti kok. Kode itu membikin struktur data yang disebut sebagai array, dengan enem elemen yang terdiri dari angka 0 sampe 5. Kemudian kode itu menjumlahkan sebuah angka acak dari 0 ke 5, dan menampilan array-element dengan index itu. pokoknya ini hanyalah javascript yang biasa ajah. Save widget itu, dan lihatlah hasilnya. Setiap kali elu me-reload halaman elu, sebuah kata-kata mutiara baru bakal tampil.

Langkah 2: Mengetahui bagaimanakah sebuah widgets bisa ditambahin di Blogger
Nah, sekarang elu sudah bikin widget lu sendiri, sekarang elu musti belajar bagaimana caranya nambahin widget ke blogger. Itu semua diterangin komplit di halaman Blogger Help . Elu tinggal bikin sebuah FORM. Form yaitu sebuah elemen HTML, dan bisa mempunyai input boxes, radio-buttons, check-boxes, buttons, dan lain-lainnya.

Langkah 3: Bikin sebuah tombol Install Widget
Sekarang kita bakalan bikin tombol instal kita sendiri dengan menggunakan sebuah form. Form elu harus kelihatan seperti ini :

<br /><script language="JavaScript"><br />//store the quotations in arrays<br />quotes = new Array(6);</span><span style="font-family: mon;"><br /></span><span style="font-size: 78%;">quotes[0] = "Sing temping pentike.";<span style="font-family: mon;"><br /></span>quotes[1] = "Sugih tanpo bondho, menang tanpo ngasorake, nglurug tanpo bala, mangan tanpo mbayar.";<span style="font-family: mon;"><br /></span>quotes[2] = "Kapal keruk taline kenceng.";<span style="font-family: mon;"><br /></span>quotes[3] = "Jaka gledek bawa anjing, elu geblek anjing.";<span style="font-family: mon;"><br /></span>quotes[4] = "Paling enak si orang bujang,badannya tinggi burungnya panjang.";</span><span><span style="font-size: 78%;"><br />quotes[5] = "Pacaran jangan berlebihan,asal jangan lebih dari hubungan badan saja.";</span></span><br /><span style="font-size: 78%;">//calculate a random index<br />index = Math.floor(Math.random() * quotes.length);<br />//display the quotation<br />document.write("\n");<br />document.write(quotes[index]);<br />//done<br /></script><br />

Mari kita lihat form ini dulu. Sebagaimana biasanya HTM, tag-pembuka dan tag-penutup . Isi dari form harus elu kirim ke url http://beta.blogger.com/add-widget. Informasi ini udah ditambahin di tag-pembuka form. Form itu harus terdiri dari 3 elemen: judul widget , isi widget ,dan sebuah tombol buat ngirim form ke Blogger. Judul widget sudah diset dengan menggunakan sebuah Input Field di form. Nama dari input field harus diset menjadi "widget.title", jadi Blogger tahu bahwa itu adalah sebuah judul widget . Value dari field boleh elu isi sesuka ati elu. Value itu bakal ditampilkan di blog elu sebagai judul widget.

Di contoh berikut gua ngeset sebagai "Kata Mutiara", tapi bisa juga elu bikin sebagai "Pemikiran Pilosopis". isi dari widget ini adalah kode javascript dari langkah 1. Kita tarok javascript ini kedalem textarea-field. Textarea punya tag-pembuka dan tag-penutup. Tarok javascript diantara dua tags itu. Didalam form ini, kita harus yakin kalo javascript itu bakal diperlakukan sebagai text, dan bukan sebagai javascript. Untuk itu, gantilah semua < dengan < dan ganti semua > dengan >. Nama dari textarea lu set ke "widget.content" jadi Blogger tahu bahwa field ini memuat isi widget . Style dari title input dan textarea elu set jadi display:none, jadi yang baca gak bakal ngeliat itu (tapi jangan cemas ding, wong sama saja ini).

Akhirnya, ada input button, value ditampilkan sebagai text tombol. Jika elu sudah ngopi form ini dan narok di akhir kode widget yang sudah ada di sidebar elu, elu bakal dapet sebuah tombol di bagian bawah widget, dan kalo ada yang ngeklik tombol itu maka otomatis akan menginstal ke blog pengunjung.

Related Posts