Borang Online Dalam Pos Blog

Panduan cipta borang online guna freedback.

Nama:
Jantina:	Laki-laki Perempuan
No. Telefon:
Alamat Email:
Alamat kediaman?
Pekerjaan anda?	Swasta Bekerja Sendiri Kerajaan Lain-lain
Jumlah Deposit (RM):
Model:	Model 1 Model 2 Model 3 Model 4 Model 5
Pilihan corak dan warna:	corak warna 1 corak warna 2 corak warna 3
Cara bayaran:	Cara bayaran 1 Cara bayaran 2 Cara bayaran 3
Bagi bayaran tunai deposit hendaklah dimasukkan ke dalam Bank (nama bank) atas nama fulan binti fulan no akaun 12345678...

This form powered by Freedback


Laman masuk freedback di http://www.freedback.com/.

Daftar buka akaun dulu:

Semak peti masuk email untuk sahkan alamat email dulu:

Selepas pengesahan email, kali pertama log masuk kedalam FreedBack taip masukkan nama dan alamat email kemudian klik Save and Continue to Step 1:

Untuk cipta atau untuk betulkan borang yang ada borang online klik Edit:

Step 1 - Edit Form

Untuk mencipta satu soalan dalam borang dengan Klik Add a Question:

Lepas klik Add a Question tetingkap Choose a Question Type akan dibuka untuk mencipta soalan dalam borang dengan format jawapan yang bersesuaian.  Format jawapan bergantung kepada jenis soalan yang akan ditanya dalam borang.  Ada tujuh format jawapan yang disediakan dalam ruangan Click to Select.  Setiap satu contoh diterangkan di bawah.   Format jawapan:

• Short Answer
• Long Answer
• Radio Buttons
• Drop Down Box
• Checkboxes
• Text Block

Format jawapan Short Answer

Sesuai untuk menjawap soalan  pendek dalam borang misalnya soalan Nama, soalan Alamat Email, soalan No Kad Pengenalan atau lain-lain.  Contoh untuk cipta soalan Nama klik Short Answer, tetingkap Short Answer akan dibuka, taip soalan dalam kotak Enter your question, tanda kotak Required bermaksud jawapan mesti diisi tidak boleh ditinggalkan kosong. Lepas itu klik SAVE:

Contoh yang akan keluar dalam borang:

Nota:

Tools yang di sebelah kiri tetingkap borang - Edit untuk betulkan kesilapan soalan dan jawapan. Delete untuk hapus soalan.  Move Up untuk pindahkan soalan ke bahagian atas. Move Down untuk pindahkan soalan ke bahagian bawah:

Format Jawapan Long Answer

Sesuai untuk jawapan yang panjang melebihi satu baris jawapan.  Contohnya soalan misalnya Alamat Kediaman. Klik Long Answer tetingkap Long Answer akan dibuka. Taip soalan dalam ruangan Enter your Question.  Tandakan kotak Required bermakna ruang jawapan mesti diisi tidak boleh ditinggalakan kosong.  Kemudian klik Save:

Contoh yang keluar dalam borang:

Format Jawapan Radio Buttons

1.6.1  Format untuk menjawab soalan yang jawapanya sudah sudah disedikan.  Pengunjung akan memilih satu daripada beberapa jawapan yang disediakan. Radio Buttons hanya membenarkan pengunjung memilih satu sahaja jawapan. Contoh mudah sediakan jawapan untuk soalan Model. Klik format jawapan Radio buttons tetingkap Radio Buttons akan dibuka.  Taip soalan dalam ruangan Enter your question. Kemudian taip jawapan bagi setiap button dalam ruangan List of radio buttons satu jawapan satu baris, dan klik Save:

Contoh yang akan keluar dalam borang:

Format Jawapan Drop Down Box

Jawapan mesti disediakan untuk dipilih oleh pengisi dalam format drop down.  Klik format Drop Down Box, tetingkap Drop Down Box akan dibuka.  Taip soalan dalam ruangan yang disediakan.  Jawapannya taip dalam ruangan List of drop down box answers satu baris satu jawapan seperti berikut. Kemudian jangan lupa klik Save:

Contoh yang akan keluar dalam borang:

Format Jawapan Checkboxes

Beberapa jawapan disediakan dulu untuk dipilih oleh pengisi borang.  Klik format Checkboxes tetingkap soalan Checkboxes akan dibuka.  Taip soalan dalam ruangan yang disediakan misalnya soalan Cara Bayaran.  Taip jawapannya dalam ruangan List of checkboxes satu jawapan satu baris seperti berikut.  Jangan lupa klik Save:

Contoh yang akan keluar dalam borang:

Format Text Block

Taip teks kenyataan atau apa-apa penerangan dalam Text Block ini. Klik format Text Block tetingkap Text Block akan dibuka.  Taip apa-apa teks kenyataan yang berkenaan dengan borang. Jangan lupa klik Save:

Tulisan dalam Text Block yang dicipta akan ditunjukkan seperti berikut:

Setelah selesai mencipta borang dalam Step 1- Edit Forms di atas, semak borang yang telah disediakan, Edit untuk betulkan sebarang kesilapan.  Kemudian klik Save and Continue to Step 2:

Step 2 - Form Options

Dalam ruangan What should people see after they submit your form? tandakan kotak Send them back to your website, taip alamat URL blog dalam ruangan Your Website tanpa http:///

Dalam tetingkap email taip masukkan alamat email dan tajuk email dalam ruangan yang disediakan.  Tandakan kotak Receive a copy of each form submission by email:

Kemudian klik Save and Continue to Step 3:

Step 3 - Get HTML

Highlight dan salin kod skrip yang disediakan dan paste masukkan dalam pos blog (lihat contoh borang di atas):

Contoh kod skrip bagi contoh borang di atas. Untuk pengetahuan tiap-tiap satu soalan berserta dengan pilihan jawapan dalam kod skrip bermula dengan <tr> dan diakhirnya ditutup dengan tag </tr>. Setiap satu warna mewakili satu soalan beserta pilihan jawapan dalam borang:

<form accept-charset="UTF-8" action="http://www.freedback.com/mail.php" enctype="multipart/form-data" method="post"><div><input id="acctid" name="acctid" type="hidden" value="0u4bmc11vfccamdd" /><input id="formid" name="formid" type="hidden" value="753161" /><input id="required_vars" name="required_vars" type="hidden" value="field-b3688752eca885a,field-74c210c308bd925,field-5b916dfecf77684" /></div> <table border="0" cellpadding="5" cellspacing="5"><tbody> <tr> <td valign="top"> <b>Nama:</b></td> <td valign="top"> <input id="field-cd87a52d150b525" name="field-cd87a52d150b525" size="40" type="text" value="" /></td> </tr> <tr> <td valign="top"> <b>Jantina:</b></td> <td valign="top"> <input id="field-bcda3b05662ed60_0" name="field-bcda3b05662ed60[]" type="checkbox" value="Laki-laki" /> Laki-laki <input id="field-bcda3b05662ed60_1" name="field-bcda3b05662ed60[]" type="checkbox" value="Perempuan" /> Perempuan</td> </tr> <tr> <td valign="top"> <b>No. Telefon:</b></td> <td valign="top"> <input id="field-b3688752eca885a" name="field-b3688752eca885a" size="40" type="text" value="" /></td> </tr> <tr> <td valign="top"> <b>Alamat Email:</b></td> <td valign="top"> <input id="field-74c210c308bd925" name="field-74c210c308bd925" size="40" type="text" value="" /></td> </tr> <tr> <td valign="top"> <b>Alamat kediaman?</b></td> <td valign="top"> <textarea cols="40" id="field-4ccbeefa8961a18" name="field-4ccbeefa8961a18" rows="6"></textarea></td> </tr> <tr> <td valign="top"> <b>Pekerjaan anda?</b></td> <td valign="top"><div style="text-align: left;"> </div> <input id="field-5b916dfecf77684_0" name="field-5b916dfecf77684[]" type="checkbox" value="Swasta" /> Swasta <input id="field-5b916dfecf77684_1" name="field-5b916dfecf77684[]" type="checkbox" value="Bekerja Sendiri" /> Bekerja Sendiri <input id="field-5b916dfecf77684_2" name="field-5b916dfecf77684[]" type="checkbox" value="Kerajaan" /> Kerajaan <input id="field-5b916dfecf77684_3" name="field-5b916dfecf77684[]" type="checkbox" value="Lain-lain" /> Lain-lain</td> </tr> <tr> <td valign="top"> <b>Jumlah Deposit (RM):</b></td> <td valign="top"> <input id="field-4515c220dfba8a6" name="field-4515c220dfba8a6" size="40" type="text" value="" /></td> </tr> <tr> <td valign="top"> <b>Model:</b></td> <td valign="top"> <input id="field-d603c97abc76e78_0" name="field-d603c97abc76e78" type="radio" value="Model 1" /> Model 1 <input id="field-d603c97abc76e78_1" name="field-d603c97abc76e78" type="radio" value="Model 2" /> Model 2 <input id="field-d603c97abc76e78_2" name="field-d603c97abc76e78" type="radio" value="Model 3" /> Model 3 <input id="field-d603c97abc76e78_3" name="field-d603c97abc76e78" type="radio" value="Model 4" /> Model 4 <input id="field-d603c97abc76e78_4" name="field-d603c97abc76e78" type="radio" value="Model 5" /> Model 5</td> </tr> <tr> <td valign="top"> <b>Pilihan corak dan warna:</b></td> <td valign="top"> <select id="field-2920d2950cfe6b5" name="field-2920d2950cfe6b5"> <option value="corak warna 1">corak warna 1</option> <option value="corak warna 2">corak warna 2</option> <option value="corak warna 3">corak warna 3</option> </select></td> </tr> <tr> <td valign="top"> <b>Cara bayaran:</b></td> <td valign="top"> <input id="field-bd6c7aa348cdfbb_0" name="field-bd6c7aa348cdfbb[]" type="checkbox" value="Cara bayaran 1" /> Cara bayaran 1 <input id="field-bd6c7aa348cdfbb_1" name="field-bd6c7aa348cdfbb[]" type="checkbox" value="Cara bayaran 2" /> Cara bayaran 2 <input id="field-bd6c7aa348cdfbb_2" name="field-bd6c7aa348cdfbb[]" type="checkbox" value="Cara bayaran 3" /> Cara bayaran 3</td> </tr> <tr> <td colspan="2" valign="top"> <b></b> <b>Bagi bayaran tunai deposit hendaklah dimasukkan ke dalam Bank (nama bank) atas nama fulan binti fulan no akaun 12345678...</b> <b></b></td> </tr> <tr> <td align="center" colspan="2"> <input type="submit" value=" Serah borang " /></td> </tr> </tbody></table> </form> <center><span style="font-family: Arial,Helvetica; font-size: xx-small;"><b> This form powered by <a href="http://www.freedback.com/">Freedback</a> </b></span></center>

This form powered by Freedback

Paste masukkan kod skrip kedalam pos blog, pilih mode Edit HTML:

Sekiranya terdapat jarak atau renggang antara satu pilihan jawapan dengan yang lain, pembetulan perlu dibuat dalam kod skrip yang diberi. Contohnya katalah dalam soalan "Model" Jarak atau renggang antara pilihan jawapan yang dimaksudkan adalah seperti pilihan model berikut:

Model:

Model 1 Model 2 Model 3 Model 4 Model 5

Ruang jarak yang berlaku adalah disebabkan baris kosong antara tag <input> di atas dengan tag <input> di bawah dalam kod skrip yang diberi seperti berikut:

<tr><td valign="top"><b>Model:</b></td><td valign="top"> <input id="field-d603c97abc76e78_0" name="field-d603c97abc76e78" type="radio" value="Model 1" /> Model 1 <input id="field-d603c97abc76e78_1" name="field-d603c97abc76e78" type="radio" value="Model 2" /> Model 2 <input id="field-d603c97abc76e78_2" name="field-d603c97abc76e78" type="radio" value="Model 3" /> Model 3 <input id="field-d603c97abc76e78_3" name="field-d603c97abc76e78" type="radio" value="Model 4" /> Model 4 <input id="field-d603c97abc76e78_4" name="field-d603c97abc76e78" type="radio" value="Model 5" /> Model 5

Untuk mengatasinya hanya hapus buang baris kosong antara <input> dengan <input> di bawah untuk dirapatkan (jangan disambung dihujungnya, hanya hapuskan baris yang kosong sahaja) seperti berikut:

Ruang jarak yang berlaku adalah disebabkan baris kosong antara tag <input> di atas dengan tag <input> di bawah dalam kod skrip yang diberi seperti berikut:

<tr><td valign="top"><b>Model:</b></td><td valign="top"> <input id="field-d603c97abc76e78_0" name="field-d603c97abc76e78" type="radio" value="Model 1" /> Model 1 <input id="field-d603c97abc76e78_1" name="field-d603c97abc76e78" type="radio" value="Model 2" /> Model 2 <input id="field-d603c97abc76e78_2" name="field-d603c97abc76e78" type="radio" value="Model 3" /> Model 3 <input id="field-d603c97abc76e78_3" name="field-d603c97abc76e78" type="radio" value="Model 4" /> Model 4 <input id="field-d603c97abc76e78_4" name="field-d603c97abc76e78" type="radio" value="Model 5" /> Model 5

Sekian, selamat mencuba dan selamat berjaya.

Sebarang pautan balik dari blog anda adalah sangat-sangat dihargai. URL http://calipso-tutorialblogger.blogspot.com/.

Salam hormat dari

Tutorial Blogger Blospot